@charset "utf-8";

html{
overflow-x:hidden;
}


body {
font-size: 0.98em;
line-height:1.5em;
font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
background: #fff;
color: #444;

}

a{color:#185c76;}
a:hover{
text-decoration:none;
color:#31c5bc;
}

a:hover img{
opacity:0.7;
    filter: alpha(opacity=75);
    -ms-filter: "alpha(opacity=75)";
    -khtml-opacity: .75;
    -moz-opacity: .75;
}


li{
list-style:none;
}

hr{
margin:3px;
}

.center{
text-align:center;
margin:0 auto;
}

.right{
text-align:right;

}

.left{
text-align:left;

}


img{
padding:2px;
}


hr{
margin:20px auto;
}


.main_block{
margin-top:0px;
width:75%;
float: right;
}

.main_block .container-fluid{
  padding-right:5px;
  padding-left:5px;  
}
/* ====================================================
ヘッダー
==================================================== */

.header{
width:100%;
height:100px;
z-index:9999;
position:fixed;
top:0;
}






.navbar {
	position: static!important;
	margin: 0!important
	
}
.navbar .navbar-inner {
background: #fff;
height:90px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
	box-shadow: 0 1px 2px rgba(0,0,0,0.15)
}
.nav-ft-2{
  margin-left:20px;
  font-size:0.9em;
  font-weight: bold;
  position: absolute;
}
.navbar .brand {
	color: #333;
	font-weight: bold;
	font-size: 0.9em;
	margin-right: 20px;
  margin-left:10px;
	padding: 5px 10px;
  position:absolute;
  top:20px;
}

.navbar .nav{
float:right;
margin-top:25px;
background:transparent;
}


.navbar .nav li a {

font-weight: bold;
color: #1e7293;
border:1px solid #efefef;
border-radius:3px;
margin:12px 5px 5px 5px;
}




.navbar .nav li a:hover {

	font-weight: bold;
	color: #1e7293;
	border:1px solid #d9f0ec;
border-radius:3px;
margin:12px 5px 5px 5px;
background:#d9f0ec;
}






/* ====================================================
左ブロック
==================================================== */

.side_block{
padding:5px;
width:24%;
float: left;
}

.side_block h4{
margin-bottom: 7px;
background-color: #3e7182;
border-radius: 5px;
color:#fff;
padding:15px;
}


.select-arrow::before {
 content: "\f107";
    font-family: FontAwesome;
    padding-right:5px;
}






.side_block img{
  width:100%;
  padding:0px;
  margin-bottom:5px;
  margin-left:0;
  text-align:center;
  object-fit: contain;
}

.side_block .side_rank img{
  height:100px;
}


.l_menu{

   max-width: 500px;
    margin-bottom: 7px;
    background-color: #e9f3f9;
    border-radius: 5px;
    padding: 1em 1.5em;
    color:#000;
    }
    
   .l_menu:hover{
opacity: 0.8;
} 




.accordion-006 {
    max-width: 500px;
    margin-bottom: 7px;
    background-color: #def0f9;
    border-radius: 5px;
border-bottom:1px solid #999;
}

.accordion-006:hover{
opacity: 0.8;
} 


.accordion-006 summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 0.6em 1.5em;

    font-weight: 600;
    cursor: pointer;
}

.accordion-006 summary::-webkit-details-marker {
    display: none;
}

.accordion-006 summary::before,
.accordion-006 summary::after {
    width: 3px;
    height: .9em;
    border-radius: 5px;
    background-color: #999;
    content: '';
}

.accordion-006 summary::before {
    position: absolute;
    right: 1.5em;
    rotate: 90deg;
}

.accordion-006 summary::after {
    transition: rotate .3s;
}

.accordion-006[open] summary::after {
    rotate: 90deg;
}

.accordion-006 p {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 0.5em 0.5em 0.5em 1.5em;
        background-color: #fff;
    color: #333333;
    transition: transform .5s, opacity .5s;
    border-bottom:1px dotted #cdcdcd;
    font-size:0.9em;
}

.accordion-006 p:hover{
 background-color: #ecf6f7;
}

.accordion-006[open] p {
    transform: none;
    opacity: 1;
}




.paleblue{
background-color: #E1F6FF;
}























h2{
background: url(../images/mark_h2.png) no-repeat 0px 0px ;
border-bottom:1px solid #666;
padding:0px 10px 5px 30px ;
margin-bottom:20px;
color:#3e7182;
font-weight:bold;
display:block;
font-size:1.25em;
line-height:1.25em;
}

h2 span{
font-size:16px;
color:#666;
margin-left:5px;
}

h3{
background:#74b5c3;
border-radius:4px;
padding:5px 10px 5px 20px ;
margin-bottom:10px;
color:#fff;
font-weight:bold;
font-size:1.05em;
}


h5{
background:#ebf4f4;
border-radius:4px;
padding:5px 10px 5px 10px ;
margin-bottom:10px;
color:#333;
font-weight:bold;
font-size:1em;
}
.h5_head{
  margin: 10px 0;
  font-family: inherit;
  font-weight: bold;
  line-height: 20px;
  color: inherit;
  text-rendering: optimizelegibility;  
}
.waku .h5_head{
  background:#ebf4f4;
  border-radius:4px;
  padding:5px 10px 5px 10px ;
  margin-bottom:10px;
  color:#333;
  font-weight:bold;
  font-size:1em;  
}

h5:before{
 content: "\f0da";
    font-family: FontAwesome;
    padding-right:5px;
}
.h5_head:before{
  content: "\f0da";
  font-family: FontAwesome;
  padding-right:5px;
}
.w100{
width:88%;
}
.w50{
width:45%;
}


.mt-20{
margin-top:20px;
}

.mt-50{
margin-top:50px;
}

.mt-80{
margin-top:80px;
}

.mt-100{
margin-top:100px;
}

.ml-10{
margin-left:12px;
}

.mr-10{
margin-right:12px;
}

.pd-5{
padding:5px;
}
 
.pd-10{
padding:10px;
} 

.pd-50{
padding-top:50px;
}


.m-10{
margin:10px;
}


.mb-50{
margin-bottom:50px;
}


.red{
color: #F75383;
}






strong{
font-size: 1.15em;
font-weight:bold;
color:#ff5359;
line-height: 140%;
padding: 2px 0;
margin:20px 5px 10px;
display:flex;
}

mark{
 background: linear-gradient(to bottom,transparent 50%, #faffbf 55%);

 }
 
 
.lead{
font-size:1.05em;

}



a:hover, a:focus {
	outline: 0
}
small, .small {
	font-size: 0.8em;
}


.wrapper {
	background: #f7f9fb;
	border-bottom: 1px solid #bbb;
	padding: 10px 0 30px 0;

}

.wrapper_green {
	background: #e5ecf0;
	padding: 30px 0
}

.wrapper.mt-100{
  margin-top: calc(100px - 10px);
}

/* ====================================================
フッター
==================================================== */

footer {
  background-color: #437d8e;
  padding-top: 9px;
  color: #ffffff;
}

footer .box4 span{
  color: #ffffff;
}


.box_footer{
width:1200px;
display:block;
margin:20px auto;
font-size:0.9em;
line-height:2em;
  color: #ffffff;
}

.box4{
width:22%;
display:inline-block;

  color: #ffffff;
  padding-top:0;
  vertical-align: top;
}

.box4 a{
  color: #eff7f7;
}

.box4 a:hover{
  color: #40d0ad;
}

.box4 a:before{
 content: "\f105";
    font-family: "FontAwesome";
    margin-right:5px;
}


.box4{
  width:22%;
  display:inline-block;
  
    color: #ffffff;
    padding-top:0;
    vertical-align: top;
  }
  
  .box4 a{
    color: #eff7f7;
  }
  
  .box4 a:hover{
    color: #40d0ad;
  }
  
  .box4 a:before{
   content: "\f105";
      font-family: "FontAwesome";
      margin-right:5px;
  }

.copy{
  color: #fff;
  font-size: 12px;
  padding:20px;
    text-align: center;
}


footer div.wrap {
	text-align: center;
}

footer small {
	color: #fff;
	font-size: 12px;
}


.back-to-top {
    position: fixed;
    right: 10px;
    bottom: 20px;
    color: #fff;
    width: 40px;
    height: 40px;
    z-index: 9999;
    display: none;
     font-weight:bold;  
}
.back-to-top:before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    position: absolute;
    left: 0;
    top: 0;
    background: #50b7bc;

}
.back-to-top:after {
    content: "↑";
    display: block;
    text-align: center;
    width: 40px;
    height: 40px;
    line-height: 40px;
    position: absolute;
    left: 0;
    top: 0;
}







/* ====================================================
フォーム
==================================================== */


form {
	margin: 0
}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input, label, input, button, select, textarea {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 13px;
	font-family: 'Open Sans', Tahoma, Arial, sans-serif
}
.input-append input, .input-prepend input, .input-append select, .input-prepend select, .input-append .uneditable-input, .input-prepend .uneditable-input {
	-webkit-border-radius: 0 3px 3px 0;
	-moz-border-radius: 0 3px 3px 0;
	border-radius: 0 3px 3px 0
}
.input-append input, .input-append select, .input-append .uneditable-input, .input-prepend .add-on:first-child, .input-prepend .btn:first-child {
	-webkit-border-radius: 3px 0 0 3px;
	-moz-border-radius: 3px 0 0 3px;
	border-radius: 3px 0 0 3px
}
.input-append .add-on, .input-prepend .add-on, .input-append .btn, .input-prepend .btn, .input-append .btn-group>.dropdown-toggle, .input-prepend .btn-group>.dropdown-toggle {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0
}
.input-append .add-on:last-child, .input-append .btn:last-child, .input-append .btn-group:last-child>.dropdown-toggle {
	-webkit-border-radius: 0 3px 3px 0;
	-moz-border-radius: 0 3px 3px 0;
	border-radius: 0 3px 3px 0
}
.input-transparent {
	border: 0!important;
	background: none!important;
	box-shadow: none!important;
	-moz-box-shadow: none!important;
	-webkit-box-shadow: none!important
}
.radio.inline, .checkbox.inline {
	white-space: nowrap

}



input[type="radio"],input[type="checkbox"]{
  position: relative;
  top: -4px;
  margin-right: 10px;
}




.align-center {
	text-align: center
}
.align-right {
	text-align: right!important
}
.clear {
	clear: both
}
.none {
	display: none
}

.form-horizontal .control-group, .form-vertical .control-group {
	margin-bottom: 0
}
.form-horizontal .control-group+.control-group, .form-vertical .control-group+.control-group {
	margin-top: 13px;
	padding-top: 13px;
	border-top: 1px solid #f5f5f5
}
.module-login {
	margin-bottom: 80px;
	margin-top: 80px
}
.module-login .form-vertical input {
	margin-bottom: 0!important
}





.selectBtn{
background:#efefef;
border:1px solid #cdcdcd;
padding:5px 15px;
margin: 15px auto;
display:block;
color:#333;
}

.selectBtn:hover{
opacity: 0.8;
}




.box1{
width:88%;
margin:3% auto;

}

.box2{
width:48%;
margin:1%;
float:left;
}

.prod-box2-wrap .box2{
  margin:0;
  width:49%;
}
.prod-box2-wrap .box2-left{
  margin-right:1%;
}
.prod-box2-wrap .box2-right{
  margin-left:1%;
}


.box3{
width:31%;
margin:1%;
display:inline;
float:left;

}

.box_footer:after{
  content: "";
  clear:both;
}

.box_footer .box3{
    width:30%;
    display:inline-block;
    color: #ffffff;
    padding-top:0;
    vertical-align: top;
    float:none;
  }
  
  .box_footer .box3 a{
    color: #eff7f7;
  }
  
  .box_footer .box3 a:hover{
    color: #40d0ad;
  }
  
  .box_footer .box3 a:before{
   content: "\f105";
      font-family: "FontAwesome";
      margin-right:5px;
  }



.cat_wt{
background-color: #fff;
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
}


.cat_gray{
background-color: #efefef;
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
}


.cat_blue{
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
background-color: #E1F6FF;
}

.cat_green{
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
background-color: #ebfff0;
}


.cat_pink{
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
background-color: #fff0ec;
}

.cat_yellow{
border:1px solid #cdcdcd;
padding:3px 15px;
border-radius:3px;
display:inline-table;
margin:5px;
font-size:0.75em;
background-color: #ffffe7;
}





.box_list01{
width:95%;
border:2px solid #74b5c3;
text-align:left;
background-color: #fff;
border-radius: 4px;
text-decoration: none!important;
padding: 10px 20px 20px 20px;
margin-top:20px;
margin-bottom:20px;
color:#666666;
display: block;
position: relative;
 z-index: 9996;
 min-height:200px;
}












.box_list01:hover{
background-color: #f1fdfb;
}

.box_list01 img{
width:50%;
max-width:400px;
max-height:400px;
height:auto;
float:left;
margin:0px 15px;
border:1px solid #cdcdcd;
padding:5px;
box-shadow: 2px 2px 4px #cdcdcd;
object-fit: contain; /* この一行を追加するだけ！ */
}

.box_list01 h4{
color:#3e7182;
font-weight:bold;
margin-top:5px;
font-size:0.85em;
}


.box_check{
font-weight: bold;
background-color: #fdfcea;
    position: absolute;
    top: -10px; /* トップからの設置位置 */
    right:0px; /* 右端からの設置位置 */
 z-index: 9997;

    border: 2px solid #74b5c3;
text-align:center;
    border-radius: 25px;
    cursor: pointer;
    -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 20%);
    box-shadow: 0 0 7px rgb(0 0 0 / 20%);
width:35px;
height:35px;
display: table;
margin-left:95%;
}

.box_check form{
margin-left:8px;
}


.listCtrl{
width:100%;
margin:10px 0px;

}

.listCtrl a{
float:left;
margin-left:5px;
}

.listCtrl label{
float:left;
margin-left:15px;

}

.listCtrl label p{
margin-top:-15px;
margin-left:30px;
}

div.conditions {
	min-height: 40px;
	display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	align-items: center;
	-ms-flex-align: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	background-color: #fff;
	border-radius:3px;
	border:1px solid #efefef;
}


.listCtrl .faq{
	font-size: 20px;
	padding-top:5px;
}

div.conditions div.list {
	padding: 7px 10px;
	margin: 0 10px 0 0;
	color: #595757;
	flex: 1;
	-ms-flex: 1;
	-webkit-box-flex: 1;
	-webkit-flex: 1;
}

div.conditions div.list span.title {
	display: table-cell;

	vertical-align: middle;
}

div.conditions div.list ul {
	display: table-cell;
	margin: 0 0 0 5px;
}

div.conditions div.list ul li {
	display: inline-block;
	margin: 3px 10px 3px 0;
	position: relative;
	bottom: -1px;
}


.listCtrl a:hover {
	opacity: 0.8;
}

div.conditions div.list span.type {
	display: inline-block;
	background-color: #707f87;
	color: #fff;
	padding: 4px 5px;
}



div.conditions div.list a.keyword:hover {
	text-decoration: line-through;
}

div.conditions div.list a.keyword::after {
	content: "\00d7";
	font-weight: normal;
	margin-left: 3px;
	font-size: 18px;
	position: relative;
	bottom: 3px;
	display: inline-block;
	vertical-align: middle;
}

div.conditions ul.condiChange {
	width: 220px;
}

div.conditions ul.condiChange li {
	float: left;
	margin-right: 10px;
	height: 40px;
	line-height: 40px;
}


div.conditions.seminar {
	margin-bottom: 10px;
}

div.conditions ul.condiChange {
	float: right;
	width: auto;
}


a.addList {
	font-size: 12px;
	padding: 6px 15px 7px 15px;
	background-color: #7cbecb;
	color: #fff;
	border-radius:20px;

}



a.requestList {
	font-size: 12px;
	padding: 6px 15px 7px 15px;
	background-color: #ee844a;
	color: #fff;
	border-radius:20px;

}

a.delList{
	font-size: 12px;
	padding: 6px 15px 7px 15px;
	background-color: hsl(167, 91%, 23%);
	color: #fff;
	border-radius:20px;

}

input.ckbox {
	display: none;
}

span.ckboxParts {

	padding-left: 20px;
	position: relative;
	margin-right: 8px;
}

span.ckboxParts::before {
	content: "";
	display: block;
	position: absolute;
	top: 5px;
	left: 0;
	width: 15px;
	height: 15px;
	background-color: #fff;
	border: 2px solid #ff813d;
	border-radius: 4px;
	box-shadow: 1px 1px 1px #b3b3b3;
	cursor: pointer;
}


span.ckboxParts.fav::before {
  border:none;
  content:"済";
  box-shadow: none;
	background-color: transparent;
  font-weight:bold;
  text-align:center;
  left:2px;
}

input.ckbox:checked + span.ckboxParts::after {
	content: "";
	display: block;
	position: absolute;
	top: -1px;
	left: 5px;
	width: 7px;
	height: 14px;
	transform: rotate(40deg);
	border-bottom: 5px solid #ba3e3d;
	border-right: 5px solid #ba3e3d;
}
input.ckbox:checked + span.ckboxParts.fav::after {
  display:none;
}
.ckboxParts span {
	display: none;
}


.check_text{
margin-right:5px;
float:left;
padding-top:7px;
}

.btn-search_block{
  text-align:right;
}

/* ====================================================
詳細ページ
==================================================== */

.waku{
border:2px solid #74b5c3;
border-radius:5px;

background: #fff;

margin-bottom:40px;
width:auto;
display:block;
padding:30px 30px 30px 30px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
position: relative;
display:table;
width: calc(100% - 100px);
}



.waku::before {
    content: "";
    top: 0;
    right: 0;
    border-bottom: 6em solid transparent;
    border-right: 6em solid #74b5c3; /* ラベルの色はここで変更 */
    position: absolute;
    z-index: 100;
}

.waku.unfav::before {
  content: "";
  top: 0;
  right: 0;
  border-bottom: 6em solid transparent;
  border-right: 6em solid #ffffff; /* ラベルの色はここで変更 */
  position: absolute;
  z-index: 100;
}

.waku.sended::before {
  content: "";
  top: 0;
  right: 0;
  border-bottom: 6em solid transparent;
  border-right: 6em solid orange; /* ラベルの色はここで変更 */
  position: absolute;
  z-index: 100;
}
.waku::after {
    content: "\f00c";
        font-family: FontAwesome;
    display: block;
    top: 20px;
    transform: rotate(0deg);
    color: #fff; /* 文字色はここで変更 */
    right: 13px;
    position: absolute;
    z-index: 101;
    font-size:1.5em;
}






.waku h1{
font-size:1.6em;
font-weight:bold;
color:#000;
margin-left:10px;
}

.waku h1 span{
font-size:0.5em;
}




.point {
	margin: 15px 0;
	line-height: 160%;

	border-radius: 30px;
	display: flex;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
}

.point img {
	margin: -5px 5px -5px 10px;
}
.point p {
	font-size: 1.15em;
font-weight:bold;
color:#ff5359;
	line-height: 140%;
	padding: 2px 0;
	width: 85%;
	margin: 1px 0;
}





.image01{
  float:left;
  margin:0px 25px 20px 20px;
  /* border:1px solid #cdcdcd; */
  /* box-shadow: 2px 2px 4px #cdcdcd; */
  display:block;

  margin-bottom:20px;
  background:#fff;
}

.image01  img{
  object-position: 50% 50%;/* デフォルト値。center centerと同じ */
  object-fit: scale-down;
  max-width:320px;
  max-height:200px;
/*  min-height:250px; */
}

.row_flex{
  display:flex;
}

.row .image01{
  float:none;
}


.image02{

margin:0px 25px 20px 20px;
border:1px solid #efefef;

display:table;

margin-bottom:20px;
background:#fff;
}

.image02 img{
object-position: 50% 50%;/* デフォルト値。center centerと同じ */

object-fit: contain;
width:320px;
height:auto;
}


.mainList_caution{
display:block;
float:none;
overflow:hidden;
}

.tab01 {
  width: 80%;
  margin-left:50px;
}
/*タブのスタイル*/
.tab_menu {
  width: 25%;
  height: 60px;
  line-height: 60px;
  font-size: 16px;
  text-align: center;
  color: #999;

  background-color: #e2e2e2;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  margin:1px;
}



.tab_menu:last-child {
   border-right:1px solid #cdcdcd;
}


.tab_menu:hover {
  background-color: #2baca4;
  color: #fff;
  opacity: 0.75;
    height: 60px;

}


.tab_contents {
border:2px solid #74b5c3;
padding:40px 30px;
clear: both;
overflow: hidden;
transition: .5s opacity;
width: calc(98% - 80px);
background-color: #fff;
margin:0 auto;
margin-left:0px;
border-radius:5px;
}

.tab_contents .lead{
font-size:1.5em;
}


.active {
  background-color: #2baca4;
  color: #fff;
}



h4.dark {
	background-color: #3e7182;
	padding: 10px 10px 6px 10px;
	color: #fff;
border-radius:10px;
	margin-bottom: 10px;
	font-size: 1em;
	position: relative;
}

h4.dark::before {
	content: url("../images/mark_h2wt.png");
	display: inline-block;
	vertical-align: middle;
	margin-right: 7px;
	position: relative;
	top: -1px;
}


.tab_contents h6{
font-size:1.0em;

color:#3e7182;
font-weight:bold;
}

.tab_contents h6:before{
 content: "\f105";
    font-family: FontAwesome;
    margin-right:5px;
}

.tab_contents .bg_green{
background-color: #edf6f6;
	padding: 15px;
	line-height: 160%;
	margin: 0 0 30px 0;
	border-radius: 5px;
}



/* ====================================================
ブログ
==================================================== */
.blog h2{
  background: #74b5c3;
    border-radius: 4px;
    padding: 5px 10px 5px 20px;
    margin-top: 50px;
    margin-bottom: 20px;
    color: #fff;
    font-weight: bold;
    font-size: 1.25em;
    border:none;
    line-height:40px;
}
.blog h3{
  background:none;
  font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;
  border-bottom: 1px solid #666;
  padding: 0px 10px 5px 0px;
  margin-top: 50px;
  margin-bottom: 20px;
  color: #467da2;
  font-weight: bold;
  display: block;
  font-size: 1.25em;
  line-height: 1.05em;
}
.blog .main_block{
  float:left;
  width:73%;
  margin-top:0;
}
.blog .side_block h2{
  margin-top:0;
}
.blog_cat{
  background:#137D9F;
  padding:3px 10px;
  text-align:center;
  display:inline-block;
  font-size:0.85em;
  color:#fff;
  }

  .blog .waku{
    border: 2px solid #74b5c3;
    border-radius: 5px;
    background: #fff;
    margin-bottom: 40px;
    width: auto;
    display: block;
    padding: 50px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: relative;
    display: table;
  }
  .blog .waku::before{
    display:none;
  }
  
  .blog .waku strong{
    margin:inherit;
    padding:inherit;
  }
  
  .eyecatch{
   width:350px;
  float:right;
  margin:15px;
  padding:0px;
  }
  
  .eyecatch img{
  border:1px solid #cdcdcd;
  }
  
  
  .blogimg{
  max-width:80%;
  display:table;
  margin:10px auto;
  border:1px solid #efefef;
  clear:both;
  }
  
  blockquote{
  margin-top:50px;
  font-style: italic;
  }
  
  .box_mokuji {
  background-image: linear-gradient(0deg, transparent calc(100% - 1px), #fff4e1 calc(100% - 1px)),
  linear-gradient(90deg, transparent calc(100% - 1px), #fff4e1 calc(100% - 1px));
    background-size: 20px 20px;
    background-repeat: repeat;
    background-position: center center;
  
    padding: 30px 5%;
    border:2px solid #FF9500;
    width:70%;
    margin:20px auto 50px auto;
    
  }
  
  .box_mokuji ol li{
  padding-bottom:0px;
  margin-bottom:0px;
  border-bottom:none;
  list-style:none;
  }
  
  .box_mokuji a{
  color:#31c5bc;
  }
  
  .box_mokuji a:hover{
  color:#000;
  }
  
  .article p{
  line-height:2.2em;
  margin:10px auto;
  }
  
  .article ul{
  width:80%;
  margin:30px auto;
  display:table;
  }
  
  
  .article li{
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px dotted #cdcdcd;
  list-style:disc;
  }
  
  
  
  .box_mokuji ol{
  counter-reset: listnum; /* カウンターをリセット */
  list-style: none; /* 標準のスタイルは消す */
  
  }
  
  .box_mokuji ol li{
  margin-bottom:15px;
  }
  
  
  .box_mokuji ol li::before{
    counter-increment: listnum; /* counter-resetと同じ文字列 */
    content: counter(listnum); /* カウントした数に応じて番号を表示 */
    margin-right:15px;
    line-height:2em;
  }
  
  
  
  
  .blog_tag li{
  border:1px solid #cdcdcd;
  background:#fff;
  border-radius:5px;
  margin-bottom:5px;
  padding:10px;
  font-size:0.9em;
  font-weight:bold;
  }
  
  .blog_tag li:hover{
  
  background:#eaf9f2;
  
  }
  
  
  
  .blog_tag li:before{
    font-family: FontAwesome;
    content: '\f02b';
    font-weight: normal;
    font-size: 14px;
    color: #2baca4;
    margin-right:5px;
  }
  
  
  .blog_document ul{
  border:1px solid #cdcdcd;
  background:#fff;
  border-radius:5px;
  margin-bottom:5px;
  padding:20px;
  display:table;
  }
  
  .blog_document li{
  padding:10px;
  border-bottom:1px dotted #cdcdcd;
  margin:5px;
  font-size:0.85em;
  background: url(../../blog/blog_images/next.png) no-repeat right bottom;
  font-weight:bold;
  }
  
  
  .side_rank .num01{
  background:#ffdf00;
  width:30px;
  height:27px;
  color:#000;
  text-align:center;
  float:left;
  display:block;
  margin-right:5px;
  margin-top:-5px;
  margin-left:-5px;
  padding-top:3px;
  }
  
  
  .side_rank .num02{
  background:#c3c3c3;
  width:30px;
  height:27px;
  color:#000;
  text-align:center;
  float:left;
  display:block;
  margin-right:5px;
  margin-top:-5px;
  margin-left:-5px;
  padding-top:3px;
  }
  
  
  .side_rank .num03{
  background:#ea9d66;
  width:30px;
  height:27px;
  color:#000;
  text-align:center;
  float:left;
  display:block;
  margin-right:5px;
  margin-top:-5px;
  margin-left:-5px;
  padding-top:3px;
  }
  
  .side_rank .num04{
  background:#c6eae5;
  width:30px;
  height:27px;
  color:#000;
  text-align:center;
  float:left;
  display:block;
  margin-right:5px;
  margin-top:-5px;
  margin-left:-5px;
  padding-top:3px;
  }
  
  
  .btn-hover {
      width: auto;
      font-size: 18px;
      font-weight: 600;
      color: #fff;
      cursor: pointer;
      margin: 20px 0px;
      height: 55px;
      text-align:center;
      border: none;
      background-size: 300% 100%;
  padding:10px 50px;
      border-radius: 50px;
      moz-transition: all .4s ease-in-out;
      -o-transition: all .4s ease-in-out;
      -webkit-transition: all .4s ease-in-out;
      transition: all .4s ease-in-out;
  }
  
  .btn-hover:hover {
      background-position: 100% 0;
      moz-transition: all .4s ease-in-out;
      -o-transition: all .4s ease-in-out;
      -webkit-transition: all .4s ease-in-out;
      transition: all .4s ease-in-out;
  }
  
  .btn-hover:focus {
      outline: none;
  }
  
  
  
  .btn-hover.color-4 {
      background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
      box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.1);
  }
  
  
  .waku2{
  border:2px solid #74b5c3;
  border-radius:5px;
  background: #fff;
  margin:0 auto;
  display:inline-block;
  padding:30px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  width:80%;
  }
  
  
  .lp01 .waku2{
    display:inline-block;
  }
  
  .green{
  color:#137d9f;
  font-size:2em;
  }
  
  
  .sns{
  width:100%;
  display:table;
  }
  .sns img{
  width:30px;
  float:left;
  }
  
  .side_block ul {
    text-align: left;
    margin-left:0;
    padding: 1%;
    clear:both;
  }
  
  
  
  .side_block li {
  
    color: #595757;
    display: block;
    margin-left:0;
  }
  
  
  
  .tit_tag{
  font-size:2em;
  margin:5px 5px 15px 10px;
  }
  
  .bloglist{
  border:1px solid #74b5c3;
  border-radius:5px;
  background: #fff;
  margin:10px;
  width:92%;
  display:table;
  padding:10px 20px;
  
  }
  
  .bloglist:hover{
  background: #fffff4;
  }
  
  .bloglist img{
  border:1px solid #cdcdcd;
  width:180px;
  float:left;
  margin-right:15px;
  }
  
  
  .bloglist h2{
  background: none;
  color:#000;
  font-size:1.1em;
  margin-left:0px;
  margin-top:0px;
  margin-bottom:0px;
  line-height:1.5em;
  
  }
  
  
  .bloglist span{
  font-size:0.85em;
  line-height:0.85em;
  
  }
  
  
  
  .koumoku{
  background:#edf6f6;
  padding:5px;
  margin-bottom:10px;
  font-weight:bold;
  }


/* ====================================================
マイページ
==================================================== */


.card{
display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  align-items: flex-start;
}

.card.card-grid4{
  grid-template-columns: repeat(4, 1fr);

}


.box_list03{
width:88%;
border:2px solid #74b5c3;
text-align:center;
background-color: #fff;
border-radius: 4px;
padding: 10px;
margin:8px 8px;
float:left;
height:250px;
 display:flex;
flex-flow: column;

}



.box_list03 img{
width:98%;
height:150px;
float:left;
margin:10px auto;
border:1px solid #cdcdcd;
box-shadow: 2px 2px 4px #cdcdcd;
object-fit: contain; /* この一行を追加するだけ！ */
}

.box_list03 h4{
font-size:14px;
font-weight:bold;

}


.box_list04{
  width:88%;
  border:2px solid #74b5c3;
  text-align:center;
  background-color: #fff;
  border-radius: 4px;
  padding: 10px;
  /* margin:8px 8px; */
  float:left;
  height:250px;
   display:flex;
  flex-flow: column;
  
  }
  
  
  
  .box_list04 img{
  width:98%;
  height:150px;
  float:left;
  margin:10px auto;
  border:1px solid #cdcdcd;
  box-shadow: 2px 2px 4px #cdcdcd;
  object-fit: contain; /* この一行を追加するだけ！ */
  
  
  }
  
  .box_list04_wrap{
    overflow: hidden;
  }

  .box_list04 h4{
  font-size:14px;
  font-weight:bold;
  
  }


.side_block ul {
	text-align: left;
	margin-left:0;
	padding: 1%;
	clear:both;
}



.side_block li {

	color: #595757;
	display: block;
	margin-left:0;
}



.koumoku{
background:#edf6f6;
padding:5px;
margin-bottom:10px;
font-weight:bold;
}

.layout_dl dt,.layout_dl dd{
  display:inline-block;
  width:45%;
}

/* ====================================================
資料請求・お問い合わせ
==================================================== */


.btnRed, .btnRed.requestList {
	display: inline-block;

	padding: 15px 15px;
	background-color: #f48a00;
	color: #fff !important;
	font-weight: bold;
	font-size: 16px;
	border:2px solid #f48a00;
	border-radius: 5px;
	box-shadow: 0 1px 0 #b3b3b3;
	text-align: center;
	margin: 5px auto;
	cursor: pointer;
	user-select: none;
}

.btnRed:hover{
background-color: #e28000;
border:2px solid #e28000;
}


.btngreen,.btngreen.addList {
	display: inline-block;

	padding: 15px 15px;
	background-color: #7cbecb;
	color: #fff !important;
	font-weight: bold;
	font-size: 16px;
	border:2px solid #7cbecb;
	border-radius: 5px;
	box-shadow: 0 1px 0 #b3b3b3;
	text-align: center;
	margin: 5px auto;
	cursor: pointer;
	user-select: none;
}

.btngreen:hover{
background-color: #689faa;
border:2px solid #689faa;
}


.btndeepgreen {
	display: inline-block;

	padding: 15px 15px;
	background-color: hsl(152, 89%, 14%);
	color: #fff !important;
	font-weight: bold;
	font-size: 16px;
	border:2px solid #7cbecb;
	border-radius: 5px;
	box-shadow: 0 1px 0 #b3b3b3;
	text-align: center;
	margin: 5px auto;
	cursor: pointer;
	user-select: none;
}

.btndeepgreen:hover{
background-color: hwb(138 2% 56%);
border:2px solid #689faa;
}

.btngray {
	display: inline-block;

	padding: 15px 15px;
	background-color: #aaa;
	color: #fff !important;
	font-weight: bold;
	font-size: 16px;
	border:2px solid #aaa;
	border-radius: 5px;
	box-shadow: 0 1px 0 #b3b3b3;
	text-align: center;
	margin: 5px auto;
	cursor: pointer;
	user-select: none;
}

.side-btn-wrap .res-addedList{
  width:88%;
  cursor:default;
}


.single_block{
margin:10px auto;
margin-bottom:40px;
width:80%;
display:table;

background:#ffff;
padding:30px 50px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.create .single_block{
  padding:10px;
}

.no-image{
  border:#ccc;
  padding:20px;
  text-align:center;
  display:block; 
  min-width:24%;
}



table {
	border-collapse: collapse;
	border-spacing: 0;
}

.view_display{
        display:none !important;
 }
 
 table.main{
 width:100%;
 display:table;
 margin:0 auto;
}
    
table.main{
  min-width:200px;
  border-bottom:1px solid #cdcdcd;
}
    
    
table.main th {
  background: #e0f2ea;
  border:1px solid #cdcdcd;
  padding: 10px;
  font-size:0.95em;
  /* white-space:nowrap; */
}

table.main td {
  border:1px solid #cdcdcd;
  padding: 10px;
}

table.main .passCaution{
  color:red;
  font-weight:bold;
}

.prod-slider{
  max-width: 320px;
  width:50%;
}
    
/** -----------------------------------------------------------------------------------------------------
*
*
*
*/    
@media screen and (max-width: 640px) {
  .row_flex{
    display:block;
  }
.prod-slider{
  width:100%;
}
  .last td:last-child {
    border-bottom: solid 1px #cdcdcd;

  }
table.main {
    width: 100%;
  }
table.main th,
table.main td {
border-bottom: none;
    display: block;

  }


  .btn-search_block{
    text-align:center;
  }

  .btn-search_block .btn-res-addList a,
  .btn-search_block .res-addedList{
    width:50%;
    max-width:168px;
  }

   .btnRed.res-reqList,
   .btnRed.res-addList
  {
    width:50%;
    max-width:168px;
  }
  
  .mainList_caution .btngray, 
  .mainList_caution .btngreen, 
  .mainList_caution .btnRed{
    width:50%;
    max-width:168px;
  }
  .side_block .btngray.w100,
  .side_block .btngreen.w100,
  .side_block .btnRed.w100
  {
    width:45%;
  }

  .box_list01 .box_list01_wrap {
    margin-left: -15px;
  }
  .box_list01 .box_list01_wrap img{
    width:100%;
  }
} 
    
    


form.formStd table.main td#note {
	word-wrap: break-word;
}

form.formStd table.main td div.horizontal {
	float: left;
}
form.formStd table.main td dt{
  margin-left:10px;
  margin-top:10px;
}
form.formStd table.main td dd{
  margin-left:0px;
  margin-bottom:10px;

}

form.formStd table.main td input[type="text"], div.inputArea input[type="text"], div.inputArea input[type="email"], div.inputArea input[type="password"], form.formStd table.main td input[type="password"], form.formStd table.main td input[type="email"], form.formStd table.main td input[type="date"], form.formStd table.main td input[type="tel"]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin: 7px 30px 7px 10px;
	height: 26px;
	font-size: 14px;
	border: 1px #ccc solid;
	border-radius: 3px;
	padding: 2px 5px;
	color: #595757;
	box-shadow: none;
}
form.formStd table.main td textarea{
  margin-left:10px;
  height:100px;
  min-width:300px;
  width:80%;
}
form.formStd table.main td select{
  margin-left:10px;
}

form.formStd table.main td input::-placeholder {
	font-size: 14px;
}

form.formStd table.main td input::-webkit-input-placeholder {
	font-size: 14px;
}

form.formStd table.main td input::-ms-input-placeholder {
	font-size: 14px;
}

form.formStd table.main td input:-moz-placeholder {
	font-size: 14px;
}

form.formStd table.main td input[name="family-name"], form.formStd table.main td input[name="given-name"], form.formStd table.main td input[name="family-name-kana"], form.formStd table.main td input[name="given-name-kana"] ,form.formStd table.main td input[name="depname"]

{
	width: 180px;
}

form.formStd table.main td span.nameTitle {
	margin-right: 15px;
	margin-left: 10px;
}

form.formStd table.main td span.nameTitleKana {
	margin-left: 10px;
}

form.formStd table.main td input[name="bday"] {
	margin: 7px 10px;
}

form.formStd table.main td input[name="postal-code"], form.formStd table.main td input[name="tel"] {

}

form.formStd table.main td input[name="company"], form.formStd table.main td input[name="email"], form.formStd table.main td input[name="pass"], form.formStd table.main td input[name="address"] {
	width: 100px;
}

form.formStd table.main td input[name="password"], form.formStd table.main td input[name="address-level2"], form.formStd table.main td input[name="address-line2"] {
	width: 80%;
}

form.formStd table.main td input[name="city"], form.formStd table.main td input[name="cityNo"], form.formStd table.main td input[name="buildingName"] {
	width: 80%;
}

form.formStd table.main td input[name="postal-code"] + a {
	text-decoration: none;
	font-size: 12px;

}

form.formStd table.main td input[name="postal-code"] + a::before {
	content: url("../images/icon_zip.png");
	display: inline-block;
	vertical-align: middle;
	position: relative;
	bottom: -1px;
	margin-right: 5px;

}

form.formStd table.main td input[name="organization"] {
	display: block;
	width: 80%;
}

form.formStd table.main td input[name="corp_url"] {
	display: block;
	width: 80%;
}

form.formStd table.main td label {
	color: #595757;
	margin: 7px 5px;
	display: inline-block;
}

form.formStd table.main td a.textLink {
	display: block;
	margin: 7px 0 7px 10px;
}


.btnArea{
margin:0 auto;
text-align:center;
}



#form1{
  display: flex;
  justify-content: right; 	
  height:30px;
  margin-bottom:15px;
}
/*入力フォーム*/
#sbox1{
  height:30px;
  width:50%;
  padding:0 15px;
  border-radius:4px 0 0 4px;
  background:#eee;
  border:none;
  outline:0;
}
/*検索ボタン*/
#sbtn2{
  width:30px;
  border-radius:0 4px 4px 0;
  background:#79bfc4;
  border:none;
  color:#fff;
  font-size:18px;
  cursor: pointer;
  position:relative;
}


#sbtn2 img{
  width:28px;
   height:28px;
position:absolute;
top:0;
left:0;
}


#sbtn2:hover{
background: #92dbff;
}


.area-open-btn{
  cursor:pointer;
  font-size:90%;
  white-space:nowrap;
  padding: 3px 15px;
}

/* ====================================================
トップページ
==================================================== */


.video-wrapper {
  position: relative;
  height: 70vh;
  width: 100%;
margin-top:90px;
}

.video-wrapper video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  position: relative;
    min-height:500px;
}



.video-wrapper::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:#2d6e84;
  opacity: 0.7;
  background-size: 4px 4px;
  background-position: 0;
      min-height:500px;
}


.catch-copy {
  position: absolute;
  top: 50px;
  bottom: 0;
  left: 0;
  width: 100%;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  text-align: center;
font-size:24px;
  color: #fff;
  margin: auto;
  z-index:333;
  line-height:2em;
  display:block;
}

.video-wrapper form{

margin:50px auto;
display:block;

}

.search_container{
margin:20x auto;
display:block; 

 background: #fff;
  
  box-sizing: border-box;
  position: relative;
  border: 1px solid #999;
  padding: 3px 10px;
  border-radius: 25px;
  height:2.3em;
  width: 90%;
  max-width:600px;
  overflow: hidden;
}
.search_container input[type="text"]{
  border: none;
  height: 2em;
  width: 90%;
    font-size: 0.8em;
}
.search_container input[type="text"]:focus {
outline: none!important;
-moz-outline-style: none;
}
.search_container input[type="submit"]{
  cursor: pointer;
  font-family: FontAwesome;
  font-size: 1.2em;
  border: none;
  background: none;
  color: #3879D9;
  position: absolute;
  width: 2.5em;
  height: 2.5em;
  right: 0;
  top: -10px;
  outline : none;
}




.img_wrap{


}
.img_wrap img a{

  cursor: pointer;
  transition-duration: 0.3s;
}
.img_wrap img a:hover{
opacity: 0; 
    filter: alpha(opacity=100);
    -ms-filter: "alpha(opacity=100)";
    -khtml-opacity: .100;
    -moz-opacity: .100;
  filter: brightness(70%);
}







.box_border{
border:2px solid #74b5c3;
border-radius:5px;
background: #fff;
margin-top:40px;
margin-bottom:40px;
width:95%;
padding:30px 30px;


}




.box_border li{
border-bottom:1px dotted #cdcdcd;
padding:5px 5px 5px 5px;
}



.bg_green{

background:#f6f9f8;
}


.special ul{
display:table;
}

.special li{
width:43%;
float:left;
}




.moreNewItem {
 display:table;

  margin: 15px auto;
  font-size: 16px;
 border:1px solid #2baca4;
border-radius:30px; 
text-align:center;
padding:10px 100px;
position:relative;
}

.moreNewItem:hover {
 display:table;
color:#fff;
  margin: 15px auto;
  font-size: 16px;
 border:1px solid #2baca4;
border-radius:30px; 
text-align:center;
padding:10px 100px;
background:#2baca4;
}

.moreNewItem::after {
 content: "\f105";
    font-family: FontAwesome;
width:15px;
  position:absolute;
  right:15px;
  font-weight:normal;
}

#link01 ,#link02 ,#link03 ,#link04 ,#tab_link{
padding-top:130px;
margin-top:-130px;
}


/* ====================================================
サイドブロックランキング
==================================================== */
.side_rank{

  width:95%;
  display:table;
  margin:15px auto;
  padding:5px;
  display:table;
  text-align:left;
  background-color: #ffffff;
  position:relative;
  }
  
  .bd_gold{
  border:2px solid #fbd091;
  }
  
  .bd_green{
  border:2px solid #bbdfe1;
  }
  .side_rank:hover{
  background:rgba(255,255,244,0.5);
  }
  
  
  .side_rank p{
  line-height:1.5em;
  font-size:0.85em;
  padding-top:10px;
  display:table;
  margin-bottom:0px ;
  }
  
  
  .side_rank .img_rank{
  width:140px;
  
  margin:5px ;
  border:3px solid #fff;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  display:inline;	
  float:left;
  }
  
  .side_medal{
  top:-15px;
  left:-15px;
  position:absolute;
  width:50px;
  z-index:888;
  }
  
  
  /* ====================================================
  ランキングカルーセル
  ==================================================== */
      .slider2 {
          width: 90%;
          margin: 50px auto;
    
      }
      .slick-slide2 {
        margin: 0px 20px;
        font-size:0.85em;
      }
      
  .slider2 img {
      width: auto;
      height: 150px;
      object-fit: cover;
  }
      
      
  .slick-slide2 img {
  min-height: 150px;
    max-height: 150px;
    object-fit:cover;
  }
      
  
     
  .slick-slide2 .slick-prev:before,
  .slick-slide2 .slick-next:before {
        color: #39a9d6;
  
      }
      
  
  
  .slick-slide2 .slick-track {
    display: flex;
  }
  .slick-slide2 {
    height: auto !important;
  }
  
  
  
  
  
  
  /* ====================================================
  ランキング
  ==================================================== */
  .nav-tabs{
  margin:20px;
  }
  
  .tit_rank{
  color:#20b6ae;
  font-size:28px;
  padding-bottom:5px;
  border-bottom:2px solid #20b6ae;
  margin:15px;
  
  }
  
  .wrap_rank{
  margin:10px auto;
  
  width:93%;
  display: flex;
  justify-content: center;
  }
  
  .wrap_rank2{
  margin:10px auto;
  
  width:93%;
  display: block;
  
  }
  
  .box_rank{
  border:3px solid #cdcdcd;
  float:left;
  margin:1%;
  padding:0px 10px 10px 10px;
  width:100%;
  border:3px solid #c7eae5;
  border-radius:10px;
  text-align:center;
  position:relative;
  background-image: url(../images/bg_ranking.png);
  background-size: contain;
  background-repeat: no-repeat;
  display: inline;
  background-color: #ffffff;
  
  }
  
  .box_rank:hover{
  background:rgba(255,255,244,0.5);
  background-image: url(../images/bg_ranking.png);
  background-size: contain;
  background-repeat: no-repeat;
  }
  
  
  
  
  .box_rank p{
  color:#333;
  font-size:0.85em;
  text-align:left;
  }
  
  
  .box_rank .img_rank{
  max-width:300px;
  height:200px;
  margin:10px 5px;
  border:3px solid #fff;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    box-shadow: 0 1px 2px rgba(0,0,0,0.15)
  }
  
  
  
  
  .box_rank_mini{
  border:3px solid #cdcdcd;
  
  width:95%;
  display:table;
  margin:10px auto;
  padding:0px 10px 10px 10px;
  display:table;
  border:3px solid #c7eae5;
  border-radius:10px;
  text-align:left;
  position:relative;
  background-color: #ffffff;
  }
  
  
  .box_rank_mini:hover{
  background:rgba(255,255,244,0.5);
  }
  
  .box_rank_mini h4{
  display:table;	
  font-size:1.15em;
  font-weight:bold;
  margin-top:25px;
  }
  
  .box_rank_mini p{
  color:#333;
  font-size:0.85em;
  padding-top:10px;
  border-top:1px solid #cdcdcd;
  display:table;	
  }
  
  
  .box_rank_mini .img_rank{
  width:180px;
  
  margin:10px 10px 10px 20px ;
  border:3px solid #fff;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
  display:inline;	
  float:left;
  }
  
  .number{
  padding:13px 0px;
  color:#006FB8;
  font-size:1.2em;
  text-align:center;
  display:inline-table;
  float:left;
  margin-top:55px;
  margin-left:15px;
  width:55px;
  height:60px;
  background-image: url(../images/medal2.png);
  background-size: 55px;
  background-repeat: no-repeat;
  }
  
  
  
  
  .box_rank_text{
  margin-top:20px;
  margin-right:20px;
  float:left;
  width:70%;
  }
  
  

/** -------------------------------------------------------------------------------------------------------------------------------------
*
*
*
*
*/
@media(max-width:767px){
body{padding:0!important}

.no-image{
  border:#ccc;
  padding:20px;
  text-align:center;
  display:block; 
  min-width:40%;
}

#app .wrapper{
  padding:10px 5px;
}

#app .video-wrapper{
  height:auto;
}
.catch-copy{
  top:110px;
}


.nav-ft-2{
  font-size:0.6em;
  font-weight:bold;
  position:absolute;
}
.navbar .brand {
	color: #333;
	font-weight: bold;
	font-size: 0.6em;
	margin-right: 20px;
  height:70px;
  padding:3px;
  overflow:hidden;
}

.navbar .navbar-inner {
  height:80px;
}

.nav-collapse{
padding-top:0px;
width:110%;
margin-left:-10px;
}

.navbar .nav{
float:none;
margin-top:50px;
padding-bottom:20px;

}


.menu_green{
width:100%;
display:table;

}

.menu_pink{
width:100%;
display:table;

}

.menu_green li{
float:left;
padding:7px;
list-style:none;
border-right:1px solid #50b7bc;
border-top:1px solid #50b7bc;
border-bottom:1px solid #50b7bc;
margin:0;
margin-top:12px;
width:auto;
}





.menu_pink li{
float:left;
padding:7px;
list-style:none;
border-right:1px solid #eb9fb5;
border-top:1px solid #eb9fb5;
border-bottom:1px solid #eb9fb5;
margin:0;
margin-top:12px;
width:auto;
}

.bg_pink{
background:#eb9fb5;
color:#fff;
}


input[type="text"]{
width:80%;
}



.wr_block{
display: flex;
flex-direction: row-reverse;
width:100%;
}

.main_block{
min-width:90%;
padding:0%;
width:100%;
display:block;
margin:0px auto;
}

.side_block{
  display:block;
  padding:5px 0;
  width:100%;
}

.video-wrapper .search_container_wrap{
  margin-bottom:100px;
  padding:10px 0;
  clear:both;
}

.video-wrapper form.search_container{
  margin:auto;

}

.box_list01{
width:86%;
border:2px solid #74b5c3;
text-align:left;
background-color: #fff;
border-radius: 4px;
text-decoration: none!important;
padding: 10px 20px;
margin-top:20px;
margin-bottom:20px;
color:#666666;
display: block;
position: relative;
 z-index: 9996;
}


.card{
display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  align-items: flex-start;
}
.card.card-grid4{
display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.15rem;
  align-items: flex-start;
}

.box_list03{
width:auto;
border:2px solid #74b5c3;
 display: flex;
background-color: #fff;
border-radius: 4px;
padding:8px;
margin:8px 5px;

}

.box_list04{
  width:auto;
  border:2px solid #74b5c3;
   display: flex;
  background-color: #fff;
  border-radius: 4px;
  padding:4px;
 /* margin:8px 5px; */
}
.box_list04 img, .box_list04 picture{
  height:auto;
}
  
.box_check{
font-weight: bold;
background-color: #fdfcea;
    position: absolute;
    top: -10px;/* トップからの設置位置 */
    right:0px;/* 右端からの設置位置 */
 z-index: 9997;

    border: 2px solid #74b5c3;
text-align:center;
    border-radius: 25px;
    cursor: pointer;
    -webkit-box-shadow: 0 0 7px rgb(0 0 0 / 20%);
    box-shadow: 0 0 7px rgb(0 0 0 / 20%);
width:35px;
height:35px;
display: table;
margin-left:90%;
}


.dispNum{
display: table;
width:100%;
}

.box_footer{
width:100%;
display:block;
margin:20px auto;
font-size:0.9em;
line-height:2em;
  color: #ffffff;
}


.box_footer .box3{
  width:90%;
  display:inline-block;
  color: #ffffff;
  padding-top:0;
  vertical-align: top;
  float:none;
}

.box_footer .box3 a{
  color: #eff7f7;
}

.box_footer .box3 a:hover{
  color: #40d0ad;
}

.box_footer .box3 a:before{
 content: "\f105";
    font-family: "FontAwesome";
    margin-right:5px;
}
    
.single_block{
margin:10px auto;
width:90%;
display:table;

background:#ffff;
padding:10px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}


.box3{
width:97%;
margin:1%;
display:block;
float:none;
padding:2%;
}

.special ul{
display: table;
height:100%;
}

.special li{
width:90%;
float:none;
}

.video-wrapper {
  position: relative;
  height: 90vh;
  width: 100%;
  margin-top:90px;

}

.video-wrapper::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:#2d6e84;
opacity: 0.7;
  background-size: 4px 4px;
  background-position: 0;
      min-height:500px;
}




.catch-copy img{
padding:5px;
width:34%;
}
.catch-copy p{
font-size:0.8em;
line-height:1.5em;
width:80%;
margin :0 auto;
}

.catch-copy br{
  display:none;
}

.catch-copy .catch_img{
  width:80%;
  margin-top:0px;
  }
  

.box4{
width:48%;
display:inline-block;
/*float:left;*/
  color: #ffffff;
  padding-top:0;
  vertical-align: top;
}

.box2{
width:98%;
margin:1%;
float:left;
}

.box1{
width:95%;
margin:3% auto;
}

.image01{
width:320px;
min-height:250px;
float:none;
margin:0px auto;
/* border:1px solid #cdcdcd; */
padding:0px;
/* box-shadow: 2px 2px 4px #cdcdcd; */
object-fit: contain; /* この一行を追加するだけ！ */
margin-bottom:20px;
background:#fff;
}

.mainList_caution{
display:block;
float:none;
overflow:hidden;
text-align:center;
}


.waku::before {
    content: "";
    top: 0;
    right: 0;
    border-bottom: 2em solid transparent;
    border-right: 2em solid #74b5c3; /* ラベルの色はここで変更 */
    position: absolute;
    z-index: 100;
}

.waku.unfav::before {
  content: "";
  top: 0;
  right: 0;
  border-bottom: 2em solid transparent;
  border-right: 2em solid #ffffff; /* ラベルの色はここで変更 */
  position: absolute;
  z-index: 100;
}


.waku.sended::before {
    content: "";
    top: 0;
    right: 0;
    border-bottom: 2em solid transparent;
    border-right: 2em solid orange; /* ラベルの色はここで変更 */
    position: absolute;
    z-index: 100;
}
.waku::after {
    content: "";
        font-family: FontAwesome;
    display: block;
    top: 20px;
    transform: rotate(0deg);
    color: #fff; /* 文字色はここで変更 */
    right: 13px;
    position: absolute;
    z-index: 101;
    font-size:1.5em;
}

.waku h1{
font-size:1.4em;
font-weight:bold;
color:#000;
margin-left:10px;
}

.waku h1 span{
font-size:0.8em;
}

.waku{
border:2px solid #74b5c3;
border-radius:5px;

background: #fff;
background-size:contain;

margin:10px auto;
margin-bottom:40px;
width:85%;
display:table;

padding:10px 20px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
position: relative;
}





.tab01 {
  width: 100%;
  margin-left:12px;
}
/*タブのスタイル*/
.tab_menu {
  width: 30%;
  height: 60px;
  line-height: 60px;
  font-size: 14px;
  text-align: center;
  color: #999;
  border-top: 3px solid #2baca4;
   border-left:1px solid #cdcdcd;
  background-color: #f9f9f9;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  margin:1px;
}

.tab_contents {
border-bottom:2px solid #2baca4;
border-left:2px solid #2baca4;
border-right:2px solid #2baca4;
border-top:1px solid #2baca4;
padding:40px 20px;
clear: both;
overflow: hidden;
transition: .5s opacity;
width:85%;
background-color: #fff;
margin:0 auto;
}

.active {
  background-color: #2baca4;
  color: #fff;
}

.box_list01 img{
width:80%;
min-height:200px;
float:none;
margin:10px auto;
border:1px solid #cdcdcd;
padding:5px;
box-shadow: 2px 2px 4px #cdcdcd;
object-fit: contain; /* この一行を追加するだけ！ */
display:block;
margin-bottom:15px;
}

/*入力フォーム*/
#sbox1{
  height:30px;
  width:100%;
  padding:0 15px;
  border-radius:4px 0 0 4px;
  background:#eee;
  border:none;
  outline:0;

}

#sbtn2 img{
  width:28px;
   height:28px;
position:absolute;
top:0;
left:2px;
}


.box_border{
border:2px solid #74b5c3;
border-radius:5px;
background: #fff;
margin-right:auto;
margin-left:auto;
margin-top:40px;
margin-bottom:10px;
width:85%;
padding:30px 20px;


}

#waku .image01{
  width:100%;
}
.image01  img{
  width:100%;
/*  min-height:250px; */
}

table.main{
  min-width:100%;
}



} /* @media max-width:767 */

/*
 * custom
 */
.checkbox-fieldset .ckboxParts{
  margin-left:8px;
}

.wlist-check-label{
  text-align:right;
}

.form_css div.alert{
  display:none;
}

#fav_count{
  
}

#app .wrapper {
  min-height: calc(100vh - 330px);
  position: relative;
}

.menu-table th{
  white-space:nowrap;
}

.sliderArea {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 25px;
}
.sliderArea.w300 {
  max-width: 300px;
}
.slick-slide {
  margin: 0 5px;
}
.slick-slide img {
  width: 100%;
  height: auto;
}
.slick-prev, .slick-next {
  z-index: 1;
}
.slick-prev:before, .slick-next:before {
  color: #000;
}
.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.thumb {
  margin: 0px 0 0;
}
.thumb .slick-slide {
  cursor: pointer;
}
.thumb .slick-slide:hover {
  opacity: .7;
}

a > i{
  margin-right:0.5em;
}

.header .navbar-inner > .container{
  padding:0;
}

.thumWrap{
  max-width:230px;
  overflow:hidden;
}

.pagination { justify-content: center; }

.pagination {
  --bs-pagination-padding-x: 0.75rem;
  --bs-pagination-padding-y: 0.375rem;
  --bs-pagination-font-size: 1rem;
  --bs-pagination-color: var(--bs-link-color);
  --bs-pagination-bg: var(--bs-body-bg);
  --bs-pagination-border-width: var(--bs-border-width);
  --bs-pagination-border-color: var(--bs-border-color);
  --bs-pagination-border-radius: var(--bs-border-radius);
  --bs-pagination-hover-color: var(--bs-link-hover-color);
  --bs-pagination-hover-bg: var(--bs-tertiary-bg);
  --bs-pagination-hover-border-color: var(--bs-border-color);
  --bs-pagination-focus-color: var(--bs-link-hover-color);
  --bs-pagination-focus-bg: var(--bs-secondary-bg);
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #0d6efd;
  --bs-pagination-active-border-color: #0d6efd;
  --bs-pagination-disabled-color: var(--bs-secondary-color);
  --bs-pagination-disabled-bg: var(--bs-secondary-bg);
  --bs-pagination-disabled-border-color: var(--bs-border-color);
  display: flex;
  padding-left: 0;
  list-style: none
}

.page-link {
  position: relative;
  display: block;
  padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
  font-size: var(--bs-pagination-font-size);
  color: var(--bs-pagination-color);
  text-decoration: none;
  background-color: var(--bs-pagination-bg);
  border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
  .page-link {
      transition: none
  }
}

.page-link:hover {
  z-index: 2;
  color: var(--bs-pagination-hover-color);
  background-color: var(--bs-pagination-hover-bg);
  border-color: var(--bs-pagination-hover-border-color)
}

.page-link:focus {
  z-index: 3;
  color: var(--bs-pagination-focus-color);
  background-color: var(--bs-pagination-focus-bg);
  outline: 0;
  box-shadow: var(--bs-pagination-focus-box-shadow)
}

.active>.page-link,.page-link.active {
  z-index: 3;
  color: var(--bs-pagination-active-color);
  background-color: var(--bs-pagination-active-bg);
  border-color: var(--bs-pagination-active-border-color)
}

.disabled>.page-link,.page-link.disabled {
  color: var(--bs-pagination-disabled-color);
  pointer-events: none;
  background-color: var(--bs-pagination-disabled-bg);
  border-color: var(--bs-pagination-disabled-border-color)
}

.page-item:not(:first-child) .page-link {
  margin-left: calc(var(--bs-border-width) * -1)
}

.page-item:first-child .page-link {
  border-top-left-radius: var(--bs-pagination-border-radius);
  border-bottom-left-radius: var(--bs-pagination-border-radius)
}

.page-item:last-child .page-link {
  border-top-right-radius: var(--bs-pagination-border-radius);
  border-bottom-right-radius: var(--bs-pagination-border-radius)
}

.pagination-lg {
  --bs-pagination-padding-x: 1.5rem;
  --bs-pagination-padding-y: 0.75rem;
  --bs-pagination-font-size: 1.25rem;
  --bs-pagination-border-radius: var(--bs-border-radius-lg)
}

.pagination-sm {
  --bs-pagination-padding-x: 0.5rem;
  --bs-pagination-padding-y: 0.25rem;
  --bs-pagination-font-size: 0.875rem;
  --bs-pagination-border-radius: var(--bs-border-radius-sm)
}

table.main th span{
  color:red;
  margin-left:1em;
  font-size:0.8em;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  font-size:14px;
  background-color:transparent;
  margin:0 auto;
}

.breadcrumb li:first-child a:before {
  /*家アイコン*/
  font-family: FontAwesome;
  content: '\f015';
  font-weight: normal;
  font-size: 14px;
  color: #2baca4;
  margin-right:5px;
}

.breadcrumb li:not(:last-of-type)::after {
  content: ">";
  margin: 0 .6em; /* 記号の左右の余白 */
  color: #777; /* 記号の色 */
}

.breadcrumb a {
  color: inherit;
  text-decoration: none;
  color: gray;
}
.breadcrumb li a:hover {
  text-decoration: underline;
}

.thum-slider-wrap{
  overflow:hidden;
  height:50px;
  max-height:50px;
}


/**
 *
 */
@media (min-width:768px) and (max-width:979px){
  .hidden-desktop{
      display:inherit !important;
  }
   .visible-desktop{
      display:none !important ;
  }
   .visible-tablet{
      display:inherit !important;
  }
   .hidden-tablet{
      display:none !important;
  }

  table.main{
    /*min-width:768px;*/
    min-width:100%;
  }
}
@media (max-width:767px){
  
  table.main{
    min-width:100%;
  }
  .hidden-desktop{
      display:inherit !important;
  }
   .visible-desktop{
      display:none !important;
  }
   .visible-phone{
      display:inherit !important;
  }
   .hidden-phone{
      display:none !important;
  }
}
@media (max-width:767px){
  body{
      padding-left:20px;
      padding-right:20px;
  }
   .navbar-fixed-top,.navbar-fixed-bottom,.navbar-static-top{
      margin-left:-20px;
      margin-right:-20px;
  }
   .container-fluid{
      padding:0;
  }
   .dl-horizontal dt{
      float:none;
      clear:none;
      width:auto;
      text-align:left;
  }
   .dl-horizontal dd{
      margin-left:0;
  }
   .container{
      width:auto;
  }
   .row-fluid{
      width:100%;
  }
   .row,.thumbnails{
      margin-left:0;
  }
   .thumbnails>li{
      float:none;
      margin-left:0;
  }
   [class*="span"],.uneditable-input[class*="span"],.row-fluid [class*="span"]{
      float:none;
      display:block;
      width:100%;
      margin-left:0;
      -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
  }
   .span12,.row-fluid .span12{
      width:100%;
      -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
  }

  .row-fluid.row-static [class*="span"]{
    display:block;
    width:100%;
    min-height:30px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    float:left;
    margin-left:5px;
  }
  .row-fluid.row-static .span12{
      width:100%;
      *width:99.94680851063829%;
  }
  .row-fluid.row-static .span11{
      width:91.45299145299145%;
      *width:91.39979996362975%;
  }
  .row-fluid.row-static .span10{
      width:82.90598290598291%;
      *width:82.8527914166212%;
  }
  .row-fluid.row-static .span9{
      width:74.35897435897436%;
      *width:74.30578286961266%;
  }
  .row-fluid.row-static .span8{
      width:65.81196581196582%;
      *width:65.75877432260411%;
  }
  .row-fluid.row-static .span7{
      width:57.26495726495726%;
      *width:57.21176577559556%;
  }
  .row-fluid.row-static .span6{
      width:48.717948717948715%;
      *width:48.664757228587014%;
  }
  .row-fluid.row-static .span5{
      width:40.17094017094017%;
      *width:40.11774868157847%;
  }
  .row-fluid.row-static .span4{
      width:31.623931623931625%;
      *width:31.570740134569924%;
  }
  .row-fluid.row-static .span3{
      width:23.076923076923077%;
      *width:23.023731587561375%;
  }
  .row-fluid.row-static .span2{
      width:14.52991452991453%;
      *width:14.476723040552828%;
  }
  .row-fluid.row-static .span1{
      width:5.982905982905983%;
      *width:5.929714493544281%;
  }
   
   .row-fluid [class*="offset"]:first-child{
      margin-left:0;
  }
   .input-large,.input-xlarge,.input-xxlarge,input[class*="span"],select[class*="span"],textarea[class*="span"],.uneditable-input{
      display:block;
      width:100%;
      min-height:30px;
      -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
  }
   .input-prepend input,.input-append input,.input-prepend input[class*="span"],.input-append input[class*="span"]{
      display:inline-block;
      width:auto;
  }
   .controls-row [class*="span"]+[class*="span"]{
      margin-left:0;
  }
   .modal{
      position:fixed;
      top:20px;
      left:20px;
      right:20px;
      width:auto;
      margin:0;
  }
  .modal.fade{
      top:-100px;
  }
   .modal.fade.in{
      top:20px;
  }

  
  .create .single_block{
    padding:0.01%;
  }
  form.formStd table.main td div.horizontal{
    float:none;
  }
}
@media (max-width:480px){
  .nav-collapse{
      -webkit-transform:translate3d(0, 0, 0);
  }
   .page-header h1 small{
      display:block;
      line-height:20px;
  }
   input[type="checkbox"],input[type="radio"]{
      border:1px solid #ccc;
  }
   .form-horizontal .control-label{
      float:none;
      width:auto;
      padding-top:0;
      text-align:left;
  }
   .form-horizontal .controls{
      margin-left:0;
  }
   .form-horizontal .control-list{
      padding-top:0;
  }
   .form-horizontal .form-actions{
      padding-left:10px;
      padding-right:10px;
  }
   .media .pull-left,.media .pull-right{
      float:none;
      display:block;
      margin-bottom:10px;
  }
   .media-object{
      margin-right:0;
      margin-left:0;
  }
   .modal{
      top:10px;
      left:10px;
      right:10px;
  }
   .modal-header .close{
      padding:10px;
      margin:-10px;
  }
   .carousel-caption{
      position:static;
  }

    
  .create .single_block{
    padding:0px;
  }

  .search_container_wrap  input[type="text"]::placeholder {
    font-size:0.7em;
  }

  .layout_dl dt{
    width:35%;

  }
  .layout_dl dd{
    width:55%;
  }
  .layout_dl dd select{
    width:98%;
  }

  .box_list03 img{
    width:98%;
    height:100px;
    float:left;
    margin:10px auto;
    border:1px solid #cdcdcd;
    box-shadow: 2px 2px 4px #cdcdcd;
    object-fit: contain; /* この一行を追加するだけ！ */
  }

  .box_list03 h4{
    display: -webkit-box;             
    -webkit-box-orient: vertical;      /* 垂直方向に配置 */
    overflow: hidden;                  /* 溢れた部分を隠す */
    text-overflow: ellipsis;           /* 溢れた部分に「...」を表示 */
    -webkit-line-clamp: 5;             /* 最大行数を2行に設定 */
  }

}
@media (min-width:768px) and (max-width:979px){
  .row{
      margin-left:0px;
      *zoom:1;
  }
  .row:before,.row:after{
      display:table;
      content:"";
      line-height:0;
  }
   .row:after{
      clear:both;
  }
   [class*="span"]{
      float:left;
      min-height:1px;
      margin-left:20px;
  }
   .container,.navbar-static-top .container,.navbar-fixed-top .container,.navbar-fixed-bottom .container{
      width:100%;
  }
   .span12{
      width:724px;
  }
   .span11{
      width:662px;
  }
   .span10{
      width:600px;
  }
   .span9{
      width:538px;
  }
   .span8{
      width:476px;
  }
   .span7{
      width:414px;
  }
   .span6{
      width:352px;
  }
   .span5{
      width:290px;
  }
   .span4{
      width:228px;
  }
   .span3{
      width:166px;
  }
   .span2{
      width:104px;
  }
   .span1{
      width:42px;
  }
   .offset12{
      margin-left:764px;
  }
   .offset11{
      margin-left:702px;
  }
   .offset10{
      margin-left:640px;
  }
   .offset9{
      margin-left:578px;
  }
   .offset8{
      margin-left:516px;
  }
   .offset7{
      margin-left:454px;
  }
   .offset6{
      margin-left:392px;
  }
   .offset5{
      margin-left:330px;
  }
   .offset4{
      margin-left:268px;
  }
   .offset3{
      margin-left:206px;
  }
   .offset2{
      margin-left:144px;
  }
   .offset1{
      margin-left:82px;
  }
   .row-fluid{
      width:100%;
      *zoom:1;
  }
  .row-fluid:before,.row-fluid:after{
      display:table;
      content:"";
      line-height:0;
  }
   .row-fluid:after{
      clear:both;
  }
   .row-fluid [class*="span"]{
      display:block;
      width:100%;
      min-height:30px;
      -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
      float:left;
      margin-left:2.7624309392265194%;
      *margin-left:2.709239449864817%;
  }
   .row-fluid [class*="span"]:first-child{
      margin-left:0;
  }
   .row-fluid .controls-row [class*="span"]+[class*="span"]{
      margin-left:2.7624309392265194%;
  }
   .row-fluid .span12{
      width:100%;
      *width:99.94680851063829%;
  }
   .row-fluid .span11{
      width:91.43646408839778%;
      *width:91.38327259903608%;
  }
   .row-fluid .span10{
      width:82.87292817679558%;
      *width:82.81973668743387%;
  }
   .row-fluid .span9{
      width:74.30939226519337%;
      *width:74.25620077583166%;
  }
   .row-fluid .span8{
      width:65.74585635359117%;
      *width:65.69266486422946%;
  }
   .row-fluid .span7{
      width:57.18232044198895%;
      *width:57.12912895262725%;
  }
   .row-fluid .span6{
      width:48.61878453038674%;
      *width:48.56559304102504%;
  }
   .row-fluid .span5{
      width:40.05524861878453%;
      *width:40.00205712942283%;
  }
   .row-fluid .span4{
      width:31.491712707182323%;
      *width:31.43852121782062%;
  }
   .row-fluid .span3{
      width:22.92817679558011%;
      *width:22.87498530621841%;
  }
   .row-fluid .span2{
      width:14.3646408839779%;
      *width:14.311449394616199%;
  }
   .row-fluid .span1{
      width:5.801104972375691%;
      *width:5.747913483013988%;
  }
   .row-fluid .offset12{
      margin-left:105.52486187845304%;
      *margin-left:105.41847889972962%;
  }
   .row-fluid .offset12:first-child{
      margin-left:102.76243093922652%;
      *margin-left:102.6560479605031%;
  }
   .row-fluid .offset11{
      margin-left:96.96132596685082%;
      *margin-left:96.8549429881274%;
  }
   .row-fluid .offset11:first-child{
      margin-left:94.1988950276243%;
      *margin-left:94.09251204890089%;
  }
   .row-fluid .offset10{
      margin-left:88.39779005524862%;
      *margin-left:88.2914070765252%;
  }
   .row-fluid .offset10:first-child{
      margin-left:85.6353591160221%;
      *margin-left:85.52897613729868%;
  }
   .row-fluid .offset9{
      margin-left:79.8342541436464%;
      *margin-left:79.72787116492299%;
  }
   .row-fluid .offset9:first-child{
      margin-left:77.07182320441989%;
      *margin-left:76.96544022569647%;
  }
   .row-fluid .offset8{
      margin-left:71.2707182320442%;
      *margin-left:71.16433525332079%;
  }
   .row-fluid .offset8:first-child{
      margin-left:68.50828729281768%;
      *margin-left:68.40190431409427%;
  }
   .row-fluid .offset7{
      margin-left:62.70718232044199%;
      *margin-left:62.600799341718584%;
  }
   .row-fluid .offset7:first-child{
      margin-left:59.94475138121547%;
      *margin-left:59.838368402492065%;
  }
   .row-fluid .offset6{
      margin-left:54.14364640883978%;
      *margin-left:54.037263430116376%;
  }
   .row-fluid .offset6:first-child{
      margin-left:51.38121546961326%;
      *margin-left:51.27483249088986%;
  }
   .row-fluid .offset5{
      margin-left:45.58011049723757%;
      *margin-left:45.47372751851417%;
  }
   .row-fluid .offset5:first-child{
      margin-left:42.81767955801105%;
      *margin-left:42.71129657928765%;
  }
   .row-fluid .offset4{
      margin-left:37.01657458563536%;
      *margin-left:36.91019160691196%;
  }
   .row-fluid .offset4:first-child{
      margin-left:34.25414364640884%;
      *margin-left:34.14776066768544%;
  }
   .row-fluid .offset3{
      margin-left:28.45303867403315%;
      *margin-left:28.346655695309746%;
  }
   .row-fluid .offset3:first-child{
      margin-left:25.69060773480663%;
      *margin-left:25.584224756083227%;
  }
   .row-fluid .offset2{
      margin-left:19.88950276243094%;
      *margin-left:19.783119783707537%;
  }
   .row-fluid .offset2:first-child{
      margin-left:17.12707182320442%;
      *margin-left:17.02068884448102%;
  }
   .row-fluid .offset1{
      margin-left:11.32596685082873%;
      *margin-left:11.219583872105325%;
  }
   .row-fluid .offset1:first-child{
      margin-left:8.56353591160221%;
      *margin-left:8.457152932878806%;
  }
   input,textarea,.uneditable-input{
      margin-left:0;
  }
   .controls-row [class*="span"]+[class*="span"]{
      margin-left:20px;
  }
   input.span12, textarea.span12, .uneditable-input.span12{
      width:710px;
  }
   input.span11, textarea.span11, .uneditable-input.span11{
      width:648px;
  }
   input.span10, textarea.span10, .uneditable-input.span10{
      width:586px;
  }
   input.span9, textarea.span9, .uneditable-input.span9{
      width:524px;
  }
   input.span8, textarea.span8, .uneditable-input.span8{
      width:462px;
  }
   input.span7, textarea.span7, .uneditable-input.span7{
      width:400px;
  }
   input.span6, textarea.span6, .uneditable-input.span6{
      width:338px;
  }
   input.span5, textarea.span5, .uneditable-input.span5{
      width:276px;
  }
   input.span4, textarea.span4, .uneditable-input.span4{
      width:214px;
  }
   input.span3, textarea.span3, .uneditable-input.span3{
      width:152px;
  }
   input.span2, textarea.span2, .uneditable-input.span2{
      width:90px;
  }
   input.span1, textarea.span1, .uneditable-input.span1{
      width:28px;
  }
}
@media (max-width:1398px){
  .container{
    width:100%;
  }
  .row{
    margin-left:0;
  }
  .container-fluid{
    padding-left:0;
  }
}
@media (min-width:1399px){
  .row{
      margin-left:0px;
      *zoom:1;
  }
  .row:before,.row:after{
      display:table;
      content:"";
      line-height:0;
  }
   .row:after{
      clear:both;
  }
   [class*="span"]{
      float:left;
      min-height:1px;
      margin-left:30px;
  }
   .container,.navbar-static-top .container,.navbar-fixed-top .container,.navbar-fixed-bottom .container{
      width:1400px;
  }
   .span12{
      width:1170px;
  }
   .span11{
      width:1070px;
  }
   .span10{
      width:970px;
  }
   .span9{
      width:870px;
  }
   .span8{
      width:770px;
  }
   .span7{
      width:670px;
  }
   .span6{
      width:570px;
  }
   .span5{
      width:470px;
  }
   .span4{
      width:370px;
  }
   .span3{
      width:270px;
  }
   .span2{
      width:170px;
  }
   .span1{
      width:70px;
  }
   .offset12{
      margin-left:1230px;
  }
   .offset11{
      margin-left:1130px;
  }
   .offset10{
      margin-left:1030px;
  }
   .offset9{
      margin-left:930px;
  }
   .offset8{
      margin-left:830px;
  }
   .offset7{
      margin-left:730px;
  }
   .offset6{
      margin-left:630px;
  }
   .offset5{
      margin-left:530px;
  }
   .offset4{
      margin-left:430px;
  }
   .offset3{
      margin-left:330px;
  }
   .offset2{
      margin-left:230px;
  }
   .offset1{
      margin-left:130px;
  }
   .row-fluid{
      width:100%;
      *zoom:1;
  }
  .row-fluid:before,.row-fluid:after{
      display:table;
      content:"";
      line-height:0;
  }
   .row-fluid:after{
      clear:both;
  }
   .row-fluid [class*="span"]{
      display:block;
      width:100%;
      min-height:30px;
      -webkit-box-sizing:border-box;
      -moz-box-sizing:border-box;
      box-sizing:border-box;
      float:left;
      margin-left:2.564102564102564%;
      *margin-left:2.5109110747408616%;
  }
   .row-fluid [class*="span"]:first-child{
      margin-left:0;
  }
   .row-fluid .controls-row [class*="span"]+[class*="span"]{
      margin-left:2.564102564102564%;
  }
   .row-fluid .span12{
      width:100%;
      *width:99.94680851063829%;
  }
   .row-fluid .span11{
      width:91.45299145299145%;
      *width:91.39979996362975%;
  }
   .row-fluid .span10{
      width:82.90598290598291%;
      *width:82.8527914166212%;
  }
   .row-fluid .span9{
      width:74.35897435897436%;
      *width:74.30578286961266%;
  }
   .row-fluid .span8{
      width:65.81196581196582%;
      *width:65.75877432260411%;
  }
   .row-fluid .span7{
      width:57.26495726495726%;
      *width:57.21176577559556%;
  }
   .row-fluid .span6{
      width:48.717948717948715%;
      *width:48.664757228587014%;
  }
   .row-fluid .span5{
      width:40.17094017094017%;
      *width:40.11774868157847%;
  }
   .row-fluid .span4{
      width:31.623931623931625%;
      *width:31.570740134569924%;
  }
   .row-fluid .span3{
      width:23.076923076923077%;
      *width:23.023731587561375%;
  }
   .row-fluid .span2{
      width:14.52991452991453%;
      *width:14.476723040552828%;
  }
   .row-fluid .span1{
      width:5.982905982905983%;
      *width:5.929714493544281%;
  }
   .row-fluid .offset12{
      margin-left:105.12820512820512%;
      *margin-left:105.02182214948171%;
  }
   .row-fluid .offset12:first-child{
      margin-left:102.56410256410257%;
      *margin-left:102.45771958537915%;
  }
   .row-fluid .offset11{
      margin-left:96.58119658119658%;
      *margin-left:96.47481360247316%;
  }
   .row-fluid .offset11:first-child{
      margin-left:94.01709401709402%;
      *margin-left:93.91071103837061%;
  }
   .row-fluid .offset10{
      margin-left:88.03418803418803%;
      *margin-left:87.92780505546462%;
  }
   .row-fluid .offset10:first-child{
      margin-left:85.47008547008548%;
      *margin-left:85.36370249136206%;
  }
   .row-fluid .offset9{
      margin-left:79.48717948717949%;
      *margin-left:79.38079650845607%;
  }
   .row-fluid .offset9:first-child{
      margin-left:76.92307692307693%;
      *margin-left:76.81669394435352%;
  }
   .row-fluid .offset8{
      margin-left:70.94017094017094%;
      *margin-left:70.83378796144753%;
  }
   .row-fluid .offset8:first-child{
      margin-left:68.37606837606839%;
      *margin-left:68.26968539734497%;
  }
   .row-fluid .offset7{
      margin-left:62.393162393162385%;
      *margin-left:62.28677941443899%;
  }
   .row-fluid .offset7:first-child{
      margin-left:59.82905982905982%;
      *margin-left:59.72267685033642%;
  }
   .row-fluid .offset6{
      margin-left:53.84615384615384%;
      *margin-left:53.739770867430444%;
  }
   .row-fluid .offset6:first-child{
      margin-left:51.28205128205128%;
      *margin-left:51.175668303327875%;
  }
   .row-fluid .offset5{
      margin-left:45.299145299145295%;
      *margin-left:45.1927623204219%;
  }
   .row-fluid .offset5:first-child{
      margin-left:42.73504273504273%;
      *margin-left:42.62865975631933%;
  }
   .row-fluid .offset4{
      margin-left:36.75213675213675%;
      *margin-left:36.645753773413354%;
  }
   .row-fluid .offset4:first-child{
      margin-left:34.18803418803419%;
      *margin-left:34.081651209310785%;
  }
   .row-fluid .offset3{
      margin-left:28.205128205128204%;
      *margin-left:28.0987452264048%;
  }
   .row-fluid .offset3:first-child{
      margin-left:25.641025641025642%;
      *margin-left:25.53464266230224%;
  }
   .row-fluid .offset2{
      margin-left:19.65811965811966%;
      *margin-left:19.551736679396257%;
  }
   .row-fluid .offset2:first-child{
      margin-left:17.094017094017094%;
      *margin-left:16.98763411529369%;
  }
   .row-fluid .offset1{
      margin-left:11.11111111111111%;
      *margin-left:11.004728132387708%;
  }
   .row-fluid .offset1:first-child{
      margin-left:8.547008547008547%;
      *margin-left:8.440625568285142%;
  }
   input,textarea,.uneditable-input{
      margin-left:0;
  }
   .controls-row [class*="span"]+[class*="span"]{
      margin-left:30px;
  }
   input.span12, textarea.span12, .uneditable-input.span12{
      width:1156px;
  }
   input.span11, textarea.span11, .uneditable-input.span11{
      width:1056px;
  }
   input.span10, textarea.span10, .uneditable-input.span10{
      width:956px;
  }
   input.span9, textarea.span9, .uneditable-input.span9{
      width:856px;
  }
   input.span8, textarea.span8, .uneditable-input.span8{
      width:756px;
  }
   input.span7, textarea.span7, .uneditable-input.span7{
      width:656px;
  }
   input.span6, textarea.span6, .uneditable-input.span6{
      width:556px;
  }
   input.span5, textarea.span5, .uneditable-input.span5{
      width:456px;
  }
   input.span4, textarea.span4, .uneditable-input.span4{
      width:356px;
  }
   input.span3, textarea.span3, .uneditable-input.span3{
      width:256px;
  }
   input.span2, textarea.span2, .uneditable-input.span2{
      width:156px;
  }
   input.span1, textarea.span1, .uneditable-input.span1{
      width:56px;
  }
   .thumbnails{
      margin-left:-30px;
  }
   .thumbnails>li{
      margin-left:30px;
  }
   .row-fluid .thumbnails{
      margin-left:0;
  }
}
@media (max-width:979px){
  body{
      padding-top:0;
  }
   .navbar-fixed-top,.navbar-fixed-bottom{
      position:static;
  }
   .navbar-fixed-top{
      margin-bottom:20px;
  }
   .navbar-fixed-bottom{
      margin-top:20px;
  }
   .navbar-fixed-top .navbar-inner,.navbar-fixed-bottom .navbar-inner{
      padding:5px;
  }
   .navbar .container{
      width:auto;
      padding:0;
  }
   .navbar .brand{
      padding-left:10px;
      padding-right:10px;
      margin:0 0 0 -5px;
  }
   .nav-collapse{
      clear:both;
  }
   .nav-collapse .nav{
      float:none;
      margin:0 0 10px;
  }
   .nav-collapse .nav>li{
      float:none;
  }
   .nav-collapse .nav>li>a{
      margin-bottom:2px;
  }
   .nav-collapse .nav>.divider-vertical{
      display:none;
  }
   .nav-collapse .nav .nav-header{
      color:#777777;
      text-shadow:none;
  }
   .nav-collapse .nav>li>a,.nav-collapse .dropdown-menu a{
      padding:9px 15px;
      font-weight:bold;
      color:#777777;
      -webkit-border-radius:3px;
      -moz-border-radius:3px;
      border-radius:3px;
  }
   .nav-collapse .btn{
      padding:4px 10px 4px;
      font-weight:normal;
      -webkit-border-radius:4px;
      -moz-border-radius:4px;
      border-radius:4px;
  }
   .nav-collapse .dropdown-menu li+li a{
      margin-bottom:2px;
  }
   .nav-collapse .nav>li>a:hover,.nav-collapse .dropdown-menu a:hover{
      background-color:#f2f2f2;
  }
   .navbar-inverse .nav-collapse .nav>li>a,.navbar-inverse .nav-collapse .dropdown-menu a{
      color:#999999;
  }
   .navbar-inverse .nav-collapse .nav>li>a:hover,.navbar-inverse .nav-collapse .dropdown-menu a:hover{
      background-color:#111111;
  }
   .nav-collapse.in .btn-group{
      margin-top:5px;
      padding:0;
  }
   .nav-collapse .dropdown-menu{
      position:static;
      top:auto;
      left:auto;
      float:none;
      display:none;
      max-width:none;
      margin:0 15px;
      padding:0;
      background-color:transparent;
      border:none;
      -webkit-border-radius:0;
      -moz-border-radius:0;
      border-radius:0;
      -webkit-box-shadow:none;
      -moz-box-shadow:none;
      box-shadow:none;
  }
   .nav-collapse .open>.dropdown-menu{
      display:block;
  }
   .nav-collapse .dropdown-menu:before,.nav-collapse .dropdown-menu:after{
      display:none;
  }
   .nav-collapse .dropdown-menu .divider{
      display:none;
  }
   .nav-collapse .nav>li>.dropdown-menu:before,.nav-collapse .nav>li>.dropdown-menu:after{
      display:none;
  }
   .nav-collapse .navbar-form,.nav-collapse .navbar-search{
      float:none;
      padding:10px 15px;
      margin:10px 0;
      border-top:1px solid #f2f2f2;
      border-bottom:1px solid #f2f2f2;
      -webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
      -moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
  }
   .navbar-inverse .nav-collapse .navbar-form,.navbar-inverse .nav-collapse .navbar-search{
      border-top-color:#111111;
      border-bottom-color:#111111;
  }
   .navbar .nav-collapse .nav.pull-right{
      float:none;
      margin-left:0;
  }
   .nav-collapse,.nav-collapse.collapse{
      overflow:hidden;
      height:0;
      top:18px;
      background-color:#fff;
  }
   .navbar .btn-navbar{
      display:block;
  }
   .navbar-static .navbar-inner{
      padding-left:10px;
      padding-right:10px;
  }
}
@media (min-width:980px){
  .nav-collapse.collapse{
      height:auto !important;
      overflow:visible !important;
  }
}

@media screen and (max-width: 960px) {

  /* ====================================================
ランキングSP
==================================================== */
.tit_rank{
color:#20b6ae;
font-size:28px;
padding-bottom:5px;
border-bottom:2px solid #20b6ae;
margin-bottom:15px;
}

.wrap_rank{
margin:10px auto;
margin-bottom:40px;
width:90%;
display:table;


}



.box_rank{
border:3px solid #cdcdcd;
float:none;
margin:15px auto;
padding:0px 10px 10px 10px;
width:95%;
border:3px solid #c7eae5;
border-radius:10px;
text-align:center;
position:relative;
background-image: url(../images/bg_ranking.png);
background-size: contain;
background-repeat: no-repeat;
 display:flex;
flex-flow: column;
background-color: #ffffff;
}





.box_rank_mini{
border:3px solid #cdcdcd;

width:100%;
display:table;
margin:15px auto;
padding:0px 5px 5px 5px;
display:table;
border:3px solid #c7eae5;
border-radius:5px;
text-align:left;
position:relative;
background-color: #ffffff;
}

.box_rank_mini h4{
display:table;	
font-size:0.8em;
font-weight:bold;
margin-top:30px;
line-height:1.2em;
}

.box_rank_mini p{
color:#333;
font-size:0.8em;
padding-top:10px;
border-top:1px solid #cdcdcd;
display:table;	
line-height:1.2em;
margin:10px;
}


.box_rank_mini .img_rank{
width:140px;
margin:35px 10px 10px 10px ;
border:0px solid #fff;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
box-shadow: 0 1px 2px rgba(0,0,0,0.15);
display:inline-block;	
float:right;
}

.number{

padding:7px 0px;
color:#006FB8;
font-size:1em;
text-align:center;
display:inline-table;
float:left;
margin-top:-15px;
margin-left:-20px;
width:40px;
height:40px;
background-image: url(../images/medal2.png);
background-size: 40px;
background-repeat: no-repeat;
}




.box_rank_text{
margin-top:20px;
float:left;
display:inline-table;
width:65%;
text-align:left;
}

.side_rank{

width:85%;
display:table;
margin:15px auto;
padding:5px;
display:table;
text-align:left;
background-color: #ffffff;
position:relative;
}



.side_rank .img_rank{
width:150px;

margin:5px ;
border:3px solid #fff;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
box-shadow: 0 1px 2px rgba(0,0,0,0.15);
display:inline;	
float:left;
}



.number{

  padding:7px 0px;
  color:#006FB8;
  font-size:1em;
  text-align:center;
  display:inline-table;
  float:left;
  margin-top:-15px;
  margin-left:-20px;
  width:40px;
  height:40px;
  background-image: url(../images/medal2.png);
  background-size: 40px;
  background-repeat: no-repeat;
  }
  
  
  
  
  .box_rank_text{
  margin-top:20px;
  float:left;
  display:inline-table;
  width:65%;
  text-align:left;
  }
  
  .side_rank{
  
  
  display:table;
  margin:15px auto;
  padding:5px;
  display:table;
  text-align:left;
  background-color: #ffffff;
  position:relative;
  }
  
  
  
  .side_rank .img_rank{
    width:150px;
    
    margin:5px ;
    border:3px solid #fff;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    display: inline;	
    float:left;
  }
  
  
  .eyecatch{
   width:80%;
  float:none;
  margin:15px auto;
  
  }
  
  .box_mokuji {
  background-image: linear-gradient(0deg, transparent calc(100% - 1px), #fff4e1 calc(100% - 1px)),
  linear-gradient(90deg, transparent calc(100% - 1px), #fff4e1 calc(100% - 1px));
    background-size: 20px 20px;
    background-repeat: repeat;
    background-position: center center;
  
    padding: 30px 5%;
    border:2px solid #FF9500;
    width:90%;
    margin:20px auto 50px auto;
    
  }
  
  .bloglist{
  
  width:auto;
  
  
  }
  
  .bloglist h2{
  
  font-size:0.9em;
  width:calc(100% - 0px);
  line-height:1.5em;
  }
  
  .bloglist span{
  float:right; 
  width:calc(100% - 150px);
  line-height:1.5em;
  }
  
  .bloglist img{
  border:1px solid #cdcdcd;
  width:130px;
  float:left;
  margin-right:10px;
  
  }


}