@charset "utf-8";
@font-face {
	font-family: "YuGothMWEB";
	src: url("../font/YuGothMWEB.eot?")  format('eot'),
	url("../font/YuGothMWEB.woff")  format('woff');
	font-display: swap;
}
html,body{
	margin:0;
	padding:0;
	width:100%;
	font-family: "YuGothMWEB";
}

#wrap{
	width:100%;
	max-width:1000px;
	margin:0 auto;
}

header{
	width:100%;
	max-width:1000px;
	margin:0 auto;
}
.sitenm{
	margin:0;
}

#contents{
	width:100%;
	max-width:1000px;
	padding:1em 0;
}

#main{
	width:750px;
	padding-left:5px;
	margin:0;
	float:right;
	box-sizing: border-box;
}

#side{
	width:250px;
	margin:0;
	padding-right:5px;
	float:right;
	box-sizing: border-box;
}

.side-menu-sec{
	background-color:#fbfbfb;
	margin-bottom:1em;
}

.menu-ttl{
	margin:0;
	text-align:center;
	padding:.5em;
	background-color:#43BEE8;
	color:#FFF;
	font-weight:bold;
}

.entry{
	padding:0 .5em;
}

footer{
	font-size:10.5pt;
	color:#FFF;
	background-color:#43BEE8;
	padding:.5em;
}

.credit{
	text-align:center;
	font-size:10pt;
	color:#534741;
	margin:0;
}


/*--------------------------------------------
	ItemList
--------------------------------------------*/
.itemlist{
	margin:0;
	padding:0;
}

.itemlist li{
	padding: .5em 0;
	border-top: 1px dashed #333;
}
.itemlist li:first-child{
	padding:0 0 .5em;
	border:none;
}
.itemlist li:last-child{
	padding:.5em 0 0;
	border-bottom: 1px dashed #333;
}
.itemlist-img{
	float:left;
	width:25%;
}
.itemlist-txt{
	float:left;
	width:75%;
	margin:1em 0;
}
.itemlist-txt p{
	margin:.5em;
	margin-right: 0;
	line-height:1;
}
.itemnm{
	font-weight:bold;
	color:#333;
}
.company{
	font-size:11pt;
	margin:0;
	padding:0 .5em;
	background-color:#f5f5dc;
	color:#696969;
}

.kodawari{
	margin:.5em;
}
.kodawari li{
	display: inline;
	margin: 0 .5em;
	padding: 0 .5em;
	background-color: #ffefa2;
}

.point-list{
	margin:.5em auto;
	padding:.5em;
	background-color:#FFFDE3;
	width: 80%;
}

.point-list li{
	margin:.5em 0;
	padding-bottom: .5em;
	border-bottom:1px dashed #534741;
	color:#534741;
	display: inline-block;
	line-height:1.2;
	width: 100%;
}
.point-list li:before{
	font-family:Font Awesome\ 5 Brands;
	content:"\f18c ";
	color:#C0E48E;
	font-size: 1.8rem;
	display: block;
	float: left;
	top: 0;
	bottom: 0;
	margin: auto;
	margin-right: .5rem;
	font-weight: normal;
}




/*--------------------------------------------
	SearchFormTbl
--------------------------------------------*/
.SearchFormTbl{
	width:100%;
}
.SearchFormTbl th{
	width:40%;
	color:#534741;
	background-color:#FFF9AA;
}
.SearchFormTbl td{
	width:60%;

}

.formhead{
	color:#FFF!important;
	background-color:#43BEE8!important;
	font-size:16pt;
}

.formhead .fa-search{
	background: #FFF;
	color: #43BEE8;
	padding: .2rem;
}

.SearchFormTbl label{
	display: inline-flex;
}

/*--------------------------------------------
	rank-box
--------------------------------------------*/
.rank-box{
	margin:2em 0 .5em;
	border:2px solid #43BEE8;
//	border-top: solid transparent;
//	border-bottom: solid transparent;
//	box-shadow: 0px 0px 5px 1px #43BEE8;
}

.rank-ttl{
	margin: 0;
	padding:.5em;
	font-weight:bold;
	font-size:24pt;
	color:#534741;
}
.rank-ttl:after {
	content: "";
	background-color: #29ABE2;
	width: 100%;
	height: 1px;
	display: block;
}
.rank-ttl img{ vertical-align: super; }
.rank-comp{
	font-size:10pt;
	padding:5px;
	background-color:#D8ECF8;
	vertical-align: text-top;
	line-height: 16pt;
	float:right;
	position: relative;
	right:2em;
	top:2em;
}
.rank-comp2{
	font-size:10pt;
	padding:5px;
	background-color:#D8ECF8;
	vertical-align: text-top;
	line-height: 16pt;
	float:right;
	right:2em;
	top:2em;
}
.rank-ttl2{
	margin-top:-2em;
	margin-bottom: 0;
}

.rank-box-content{
	padding:.5em;

}

.box-left{
	width:45%;
	float:left;
	display:table;
}

.table-cell{
	display: table-cell;
	vertical-align: middle;
}

.box-right{
	width:55%;
	float:right;
	padding:.5rem;
	box-sizing: border-box;
}

.brand-tbl{ margin-top:2em; }
.brand-tbl th,brand-tbl td{
	width:50%;
}

/*--------------------------------------------
	Rate
--------------------------------------------*/
.rate5:after{
	content:"★★★★★";
}
.rate4:after{
	content:"★★★★";
}
.rate3:after{
	content:"★★★";
}
.rate2:after{
	content:"★★";
}
.rate1:after{
	content:"★";
}
.rate5:after,.rate4:after,.rate3:after,.rate2:after,.rate1:after{
	color: #ffd700;
}



/*--------------------------------------------
	scroll_box
--------------------------------------------*/

.contents-box{
	background-color:#43BEE8;
	padding:.5em;
	margin: .5em 0;
}

.scroll_box {
	border-top: none;
	color: #3b2407;
	background-color: #FFF;
	text-align: left;
	padding: .5em 0 .5em .5em;
}

.scroll_box .scroll_content {
	padding: 0;
	height: 300px;
	overflow: auto;
}

.scroll_box .scroll_contents:first-child {
	border-top: 1px dashed;
}

.scroll_box .scroll_contents {
	margin: 0;
	font-size: 10.5pt;
	border-bottom: 1px dashed;
	padding:.5em 0;
}

.auther{
	font-size:10pt;
}
.auther-png{
	float:left;
}
.auther-date{
	float:left;
	line-height:1;
	margin-top:.5rem;
	margin-left:.5rem;
}
.auther-name{
	display:block;
}






/*--------------------------------------------
	Campaign
--------------------------------------------*/
.campaign{
	margin:.5em 0;
	border:2px solid #F7931E;
}
.campaign p{
	margin:0;
	padding:.5em 1em;
	font-weight:bold;
	color:#FFF;
	background-color:#F7931E;
	text-align:center;
}
.campaign ul{
	padding:0 .5em;
}
.campaign ul li{
	font-weight:bold;
}
.campaign ul li:before {
	content: "";
	color:#534741;
	margin-right: .5em;
}

/*--------------------------------------------
	Button
--------------------------------------------*/
.btn{
	font-size:11px;
	color:#737373;
	line-height:26px;
	text-shadow:0 1px 1px rgba(255,255,255,.5);
	display:inline-block;
	background-color:#e2e2e2;
	background:-webkit-linear-gradient(top,#fff 0,#f5f5f5 1%,#e2e2e2 100%);
	background:-moz-linear-gradient(top,#fff 0,#f5f5f5 1%,#e2e2e2 100%);
	background:linear-gradient(top,#fff 0,#f5f5f5 1%,#e2e2e2 100%);
	height:26px;
	width:133px;
	border:1px solid #bfbfbf;
	border-radius:4px;
	cursor:pointer;
}
input.btn_full,input.btn_large,input.btn_xlarge,input.btn_xxlarge{
	line-height:40px;
	height:40px;
}
.btn_full,.btn_large,.btn_xlarge,.btn_xxlarge{
	font-size:17px;
	font-weight:700;
	line-height:38px;
	height:38px;
}
.btn_large { width:75%; }
.btn_xlarge {
	width:80%;
	max-width:350px;
}
.btn_xxlarge{
	width: 98%;
	max-width:500px;
}

.btn.selected,.btn_primary{
	color:#fff;
	text-shadow:0 1px 1px rgba(0,0,0,.5);
	background-color:#57af01;
	background-image:-webkit-linear-gradient(top,#b8e061 0,#93d100 1%,#57af01 100%);
	background-image:-moz-linear-gradient(top,#b8e061 0,#93d100 1%,#57af01 100%);
	background-image:linear-gradient(top,#b8e061 0,#93d100 1%,#57af01 100%);
	border:1px solid #438400;
}

.detailbtn{ width:96%; }

.brnd-btn-wrap{
	width:48%;
	margin:0 1%;
	float:left;
	text-align:center;
}
.official-btn{
    border-radius: 1rem;
	color:#fff;
	text-shadow:0 2px 2px rgba(0,0,0,.5);
	background-color:#57af01;
	background-image:-webkit-linear-gradient(top,#91c73e 10%,#74BC41 50%,#49AF48 100%);
	background-image:-moz-linear-gradient(top,#91c73e 10%,#74BC41 50%,#49AF48 100%);
	background-image:linear-gradient(top,#91c73e 10%,#74BC41 50%,#49AF48 100%);
	border:2px solid #659941;
	height: 3em;
	line-height: 3rem;
	width:96%;
}
.detail-btn{
	color:#fff;
	text-shadow:0 2px 2px rgba(0,0,0,.5);
	background-color:#0187af;
	background-image:-webkit-linear-gradient(top,#71c8f0 10%,#60BEE5 50%,#44AADF 100%);
	background-image:-moz-linear-gradient(top,#71c8f0 10%,#60BEE5 50%,#44AADF 100%);
	background-image:linear-gradient(top,#71c8f0 10%,#60BEE5 50%,#44AADF 100%);
	border:2px solid #0098CC;
	border-radius: 1rem;
	height: 3em;
	line-height: 3rem;
	width:96%;
}
a,.txt-deco-none{ text-decoration:none; }
/*--------------------------------------------
	Order AND Sort
--------------------------------------------*/
i.oas{
	display: inline-block;
	font: normal normal normal 16px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	cursor: pointer;
}
i.sort:before{
	color: #999;
	content: "\f0dc";
}
i.sort-desc:before{ content: "\f0dd"; }
i.sort-asc:before{ content: "\f0de"; }
i.on{ color: #43bee8; }
.cursor-pointer{ cursor: pointer; }

/*--------------------------------------------
	eyechacth-box
--------------------------------------------*/
.eyechacth-box{
	position: relative;
	margin-bottom: 2em;
}
.eyechacth-box h1{
	padding: .5em 3em .5em 1em;
	background-color: #43BEE8;
	-webkit-box-shadow: 3px 3px 3px #CCC;
	box-shadow: 3px 3px 3px #CCC;
	-webkit-border-radius: 0 10px 10px 0 / 0 10px 10px 0;
	-moz-border-radius: 0 10px 10px 0 / 0 10px 10px 0;
	-ms-border-radius: 0 10px 10px 0 / 0 10px 10px 0;
	-o-border-radius: 0 10px 10px 0 / 0 10px 10px 0;
	border-radius: 0 10px 10px 0 / 0 10px 10px 0;
	font-size:1.2em;
	font-weight:bold;
	color: #FFF;
}
.eyechacth-box h1:before{
	margin-right: 0.8em;
	font-family: Font Awesome\ 5 Free;
	content: "\f0c6";
	color: #FFF;
}
.eyechacth-img{
	width:100%;
	text-align:center;
}
.eyechacth-box img.size-full{
}


/*--------------------------------------------
	H-Tag
--------------------------------------------*/
h1,.h1{

}

h2,.h2{
	font-size:1.2em;
	padding:.5em 1em;
//	border-top: 1px solid #f28f31;
	border-bottom: 2px solid #43BEE8;
}

h3,.h3{
	font-size:1.1em;
	font-weight: bold;
	padding:0 .5em;
	border:none;
	border-left:5px solid #43BEE8;
	background:transparent;

}

/*--------------------------------------------
	P
--------------------------------------------*/
p,body{
	font-size:14pt;
}
section{
	padding:.5em;
}

.block{ display:block; }
.bold{ font-weight:bold; }
.small{ font-size:10.5pt; }

.red{ color:red!important; }
.blue{ color:#000080!important; }
.yellow{ color:#ffff00!important; }
.bgyellow{ background-color: #ffff00!important; }

.ta_c{ text-align:center; }
.ta_l{ text-align:left; }
.ta_r{ text-align:right; }

.underline{
	text-decoration: underline red!important;
}

/*--------------------------------------------
	Font-Size
--------------------------------------------*/
.fs8{ font-size:8pt!important; }
.fs9{ font-size:9pt!important; }
.fs10{ font-size:10pt!important; }
.fs11{ font-size:11pt!important; }
.fs12{ font-size:12pt!important; }
.fs13{ font-size:13pt!important; }
.fs14{ font-size:14pt!important; }
.fs15{ font-size:15pt!important; }
.fs16{ font-size:16pt!important; }
.fs17{ font-size:17pt!important; }
.fs18{ font-size:18pt!important; }
.fs19{ font-size:19pt!important; }
.fs20{ font-size:20pt!important; }
.fs21{ font-size:21pt!important; }
.fs22{ font-size:22pt!important; }
.fs23{ font-size:23pt!important; }
.fs24{ font-size:24pt!important; }
.fs25{ font-size:25pt!important; }
.fs26{ font-size:26pt!important; }
.fs28{ font-size:28pt!important; }


/*--------------------------------------------
	List
--------------------------------------------*/
ul,ol{
	padding:0;
	list-style-type:none;
}

li{
	line-height:1.8em;
}


.side-menu-sec ul{
	margin:0;
	padding:0;
}

.side-menu-sec ul li{
	padding: .5em 0;
	border-top: 1px dashed #c0c0c0;
	color:#666666;
}
.side-menu-sec ul li:first-child{
	padding:0 0 .5em;
	border:none;
}
.side-menu-sec ul li:last-child{
	padding:.5em 0 0;
}

.side-menu-sec ul li:before{
	content: "\25B6";
	margin-right:.5em;
}

.side-menu-sec ul li a{
	color:#666666;
}

/*--------------------------------------------
	Table
--------------------------------------------*/
table,td,th{
	border-collapse:collapse;
}

table{
	width:100%;
	margin:1em auto;
}
th,td{
	padding:.5em .4em;
	border:1px solid #534741;
}

th{
	color:#534741;
	background-color:#CAEFFF;
	text-align:center;
}
td{
	color:#534741;
}
.form-tbl th{ background-color:#FFF9AA; }
.va_m{
	vertical-align:middle;
}
.rank-tbl{
	font-size:10pt;
}
.rank-tbl th{
	width:20%;
}
.rank-tbl td{
	width:16%;
	vertical-align:top;
	text-align:center;
}
.rank-cell,.rank-cell td{
	border:none;
}
.bdrt0{ border-top:none; }
.bdrb0{ border-bottom:none; }

.double{
	font-size:150%;
	color:#CC6072;
	font-size: 3.5rem;
	line-height: 1;
}
.single{
	font-size:150%;
	font-weight:bold;
	color:#ffa500;
	font-size: 3rem;
	line-height: 1.1;
}
.triangle{
	font-size:150%;
	font-weight:bold;
	color:#65AADD;
	font-size: 3rem;
	line-height: 1;
}
.but{
	font-size:150%;
	font-weight:bold;
	color:#5C5A5A;
	font-size: 3rem;
	line-height: 1;
}

/*--------------------------------------------
	Float
--------------------------------------------*/
.fl{ float:left; }
.fr{ float:right; }
.clr{ clear:both; }
.cf{ min-height:1px; }
.cf:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	overflow: hidden;/* 隙間対応 */
	font-size: 0.1em;/* 隙間対応 */
	line-height: 0;/* 隙間対応 */
}



/*--------------------------------------------
	その他
--------------------------------------------*/
img{
	vertical-align:bottom;
}

.fa-gem{
	color:#29ABE2;
	font-size:16pt;
}

.block{ display:block; }
/*--------------------------------------------
	Margin
--------------------------------------------*/
.m_auto{ margin:0 auto; }
.m0{ margin:0px; }
.m3{ margin:3px; }
.m5{ margin:5px; }
.m10{ margin:10px; }
.m15{ margin:15px; }
.m20{ margin:20px; }
.m25{ margin:25px; }
.m30{ margin:30px; }
.m35{ margin:35px; }
.m40{ margin:40px; }
.m45{ margin:45px; }
.m50{ margin:50px; }

.m05em{ margin:.5em; }
.m1em{ margin:1em; }
.m1-5em{ margin:1.5em; }
.m2em{ margin:2em; }
.m2-5em{ margin:2.5em; }
.m3em{ margin:3em; }
.m3-5em{ margin:3.5em; }


.mt0{ margin-top:0px; }
.mt5{ margin-top:5px; }
.mt10{ margin-top:10px; }
.mt15{ margin-top:15px; }
.mt20{ margin-top:20px; }
.mt25{ margin-top:25px; }
.mt30{ margin-top:30px; }
.mt35{ margin-top:35px; }
.mt40{ margin-top:40px; }
.mt45{ margin-top:45px; }
.mt50{ margin-top:50px; }

.mt1em{ margin-top:1em; }
.mt1-5em{ margin-top:1.5em; }
.mt2em{ margin-top:2em; }
.mt2-5em{ margin-top:2.5em; }
.mt3em{ margin-top:3em; }
.mt3-5em{ margin-top:3.5em; }


.ml5{ margin-left:5px; }
.ml10{ margin-left:10px; }
.ml15{ margin-left:15px; }
.ml20{ margin-left:20px; }
.ml25{ margin-left:25px; }
.ml30{ margin-left:30px; }
.ml35{ margin-left:35px; }
.ml40{ margin-left:40px; }
.ml45{ margin-left:45px; }
.ml50{ margin-left:50px; }

.ml1em{ margin-left:1em; }
.ml1-5em{ margin-left:1.5em; }
.ml2em{ margin-left:2em; }
.ml2-5em{ margin-left:2.5em; }
.ml3em{ margin-left:3em; }
.ml3-5em{ margin-left:3.5em; }


.mb0{ margin-bottom:0; }
.mb5{ margin-bottom:5px; }
.mb10{ margin-bottom:10px; }
.mb15{ margin-bottom:15px; }
.mb20{ margin-bottom:20px; }
.mb25{ margin-bottom:25px; }
.mb30{ margin-bottom:30px; }
.mb35{ margin-bottom:35px; }
.mb40{ margin-bottom:40px; }
.mb45{ margin-bottom:45px; }
.mb50{ margin-bottom:50px; }

.mb1em{ margin-bottom:1em; }
.mb1-5em{ margin-bottom:1.5em; }
.mb2em{ margin-bottom:2em; }
.mb2-5em{ margin-bottom:2.5em; }
.mb3em{ margin-bottom:3em; }
.mb3-5em{ margin-bottom:3.5em; }



.m5_0{ margin:5px 0; }
.m10_0{ margin:10px 0; }
.m15_0{ margin:15px 0; }

.m1em_0{ margin:1em 0; }
.m2em_0{ margin:2em 0; }

.m1em_auto{ margin:1em auto; }
.m2em_auto{ margin:2em auto; }

/*--------------------------------------------
	Padding
--------------------------------------------*/
.p0{ padding:0; }
.p5{ padding:5px; }
.p10{ padding:10px; }
.p15{ padding:15px; }
.p20{ padding:20px; }
.p25{ padding:25px; }
.p30{ padding:30px; }
.p35{ padding:35px; }
.p40{ padding:40px; }
.p45{ padding:45px; }
.p50{ padding:50px; }

.p05em{ padding:.5em; }
.p1em{ padding:1em; }
.p1-5em{ padding:1.5em; }
.p2em{ padding:2em; }
.p2-5em{ padding:2.5em; }
.p3em{ padding:3em; }
.p3-5em{ padding:3.5em; }


.pt5{ padding-top:5px; }
.pt10{ padding-top:10px; }
.pt15{ padding-top:15px; }
.pt20{ padding-top:20px; }
.pt25{ padding-top:25px; }
.pt30{ padding-top:30px; }
.pt35{ padding-top:35px; }
.pt40{ padding-top:40px; }
.pt45{ padding-top:45px; }
.pt50{ padding-top:50px; }

.pl5{ padding-left:5px; }
.pl10{ padding-left:10px; }
.pl15{ padding-left:15px; }
.pl20{ padding-left:20px; }
.pl25{ padding-left:25px; }
.pl30{ padding-left:30px; }
.pl35{ padding-left:35px; }
.pl40{ padding-left:40px; }
.pl45{ padding-left:45px; }
.pl50{ padding-left:50px; }



.p0_5{ padding:0 5px; }

.p5_0{ padding:5px 0; }
.p10_0{ padding:10px 0; }
.p15_0{ padding:15px 0; }
.p20_0{ padding:20px 0; }


.p0_10{ padding:0 10px; }
.p5_10{ padding:5px 10px; }

.p10_40{ padding:10px 40px; }
.p15_40{ padding:15px 40px; }
.p20_40{ padding:20px 40px; }

/*--------------------------------------------
	Social Bookmarking
--------------------------------------------*/
/* SNSボタン */
.share { margin : 1em 0; }
.share ul {
	margin : 0;
	padding : 0;
	list-style : none;
}
.share li a {
	display : block;
	padding : 10px;
	color : #fff;
	font-size : 14px;
	text-decoration : none;
	text-align : center;
}
.share li a:hover {
	opacity :0.8;
	color : #fff;}
.share li a:visited{ color: #fff; }
.share ul:after {
	content : "";
	display : block;
	clear : both;}
.tweet a{ background-color : #55acee; }
.facebook a{ background-color : #315096; }
.googleplus a{ background-color : #dd4b39; }
.hatena a{ background-color : #008fde; }
.share li {
	float : left;
	width : 25%;
	margin : 0;
	margin-top:15px;
}
@media only screen and (max-device-width: 768px) {
	.share li {
		float : left;
		width : 100%;
		margin:0 2% 3% 0;
	}
	.share li a { border-radius:6px; }
}
/*------- Social Bookmarking End ---------------------------*/

/*--------------------------------------------
	PC用
--------------------------------------------*/
@media only screen and (min-width:1024px){
	.pc-none{ display:none; }
	.sp-only{ display:none; }
	.SearchFormTbl label{ width: calc((100% - 2em) / 3); }

}

/*--------------------------------------------
	TAB用
--------------------------------------------*/
@media only screen and (min-width:769px) and (max-width:1023px){
	.pc-only{ display:none; }
	.sp-only{ display:none; }
	.SearchFormTbl label{ width: calc((100% - 1em) / 3); }
}
/*--------------------------------------------
	スマホ用
--------------------------------------------*/
@media only screen and (max-width:768px){
	.sp-none{ display:none; }
	.pc-only{ display:none; }

	#main,#side,.box-left,.box-right,.g-box-right{
		width:98%;
		padding:1%;
		margin:auto;
		clear:both;
		float:none;
	}

	.eyechacth-box img.size-full{
		width:98%;
		margin:0 1%;
		height:auto;
	}

	/*--------------------------------------------
		Table
	--------------------------------------------*/
	table{
		width:100%;
		table-layout: fixed;　　/*追加する*/

	}
	.rank-tbl .detailbtncell:nth-child(4),.rank-tbl .detailbtncell:nth-child(5),.rank-tbl td:nth-child(5),.rank-tbl td:nth-child(6){ display:none; }
	.rank-tbl th,.rank-tbl td{
		width:25%;
	}
	.form-tbl th,.form-tbl td{
		display:block;
	}

	/*--------------------------------------------*/
	.rank-ttl{
		padding:.5em;
	}
	.rank-comp{
		float:left;
		left:0;
		top:0;
	}

	.SearchFormTbl th,.SearchFormTbl td{
		display:block;
		width:100%;
		box-sizing:border-box;
	}

	/*--------------------------------------------
		Btn
	--------------------------------------------*/
	.btn_xlarge { width: 98%; }
	.btn_xxlarge{ width: 98%; }
	.brnd-btn-wrap{
		width:98%;
		margin:.5em 1%;
		clear:both;
		text-align:center;
	}
	.official-btn,.detail-btn{
		margin:0 auto;
	}
}