@charset "utf-8";

@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//use.fontawesome.com/releases/v5.0.6/css/all.css);



/*
	font-family:"FontAwesome";
	font-family:"Font Awesome 5 Free";
*/


/*========================================
 Base
========================================*/
html {font-size:62.5%;}
body{
	font-size:1.2rem;
	line-height:1.6;
}

body > #top{
    background:#fff;
    font-size:12px;
    margin-top:-15px;
    padding-top:15px;
}
div#header{
	background:none !important;
	margin:0 auto;
}
div#contents div.topic_path,
div#contents div.topic_path a{
	width:1080px;
	margin:0 auto;
	padding-left:10px;
	text-decoration:none;
	box-sizing:border-box;
}

div#contents{
	position:relative;
	width:1080px;
	margin:0 auto;
}
#contents * {box-sizing:border-box;}
.corner_info p {padding:0;}

div.corner_product {margin:0 0 50px !important;}
div.itemdetail{
	width:1080px;
	margin:0;
	height:auto;
	border:none;
	font-size:1.2rem;
	text-overflow:inherit;
}
.corner_info h3 {border:none; background:none;}
.corner_info > h3 {display:none !important;}
.corner_info #bd + h3 {display:block !important;}
.corner_info > p {display:none;}

.footer_link a {color:#262626 !important;}


/*商品情報*/
#detailBox{
	float:none;
	width:1000px;
	margin:0 auto 40px;
	padding:10px 0 20px;
	font-size:12px;
}
ul.searchList{
	display:block;
	border-collapse:separate;
	border-spacing:14px;
	width:1020px !important;
	margin:0 auto !important;
	padding:0 13px;
}
ul.searchList:last-child {margin-bottom:30px !important;}
ul.searchList li div div.detail, #detailBox {width:700px;}
ul.searchList li p.photo{
	height:175px;
	padding-top:10px;
}
ul.searchList li h5{
	padding-bottom:10px;
	border-bottom:1px dotted #aaaaaa;
}

#detailBox .detailArea div {padding:5px;}
#detailBox .detailArea div p.date {font-size: 1.2em;}

/*#contents {padding-bottom:30px;}*/
div#sns {overflow:hidden;}


/* リセット */
#contents ul{
	-webkit-margin-before:0;
	-webkit-margin-after:0;
	-webkit-padding-start:0;
}
#contents a:hover {opacity:1;}
#contents footer a:hover {opacity:0.5;}


/*========================================
 カスタム
========================================*/
/* 商品 */
ul.searchList li{
	background:#f3f3eb;
	float:none;
	display:table-cell;
	width:231px !important;
	padding:10px;
	vertical-align:top;
	border:1px solid #af995d !important;
	box-sizing:border-box;
}
ul.searchList li a {color:#9c8871;}


/* 全体 */
#containers {background:url(../images/keyvisu.png) center 46px no-repeat, url(../images/bg.jpg) center top fixed;}
#contents{
	font-family:"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:url(../images/bg_pattern.jpg) center top;
	position:relative;
	margin-bottom:0 !important;
	color:#262626;
	/*box-shadow:0 0 10px #08162e;*/
}
#contents .smOnly {display:none;}
#contents a {color:#262626;}

#contents .topic_path,
#contents .topic_path a{
	padding-top:10px !important;
	color:#000;
	text-shadow:1px 1px 0 #fff;
}
#contents .topic_path a:hover {opacity:0.5;}

#contents .itemdetail {border-radius:10px 10px 0 0;}
#contents .corner_product {width:1080px;}
ul.searchList:last-child {padding-bottom:20px;}

#contents .corner_main_banner {display:none;}
/*#contents .corner_info > div {margin-bottom:80px;}*/


/**** SNS ****/
#contents #sns{
	position:absolute;
	top:0;
	right:20px;
	width:auto !important;
	z-index:50;
}


/* header */
#contents #headerWrap{
	position:relative;
	width:1080px;
	height:640px;
}
#contents #Logo{
	position:absolute;
	top:23px;
	left:0;
	width:1080px;
	height:156px;
}
#contents #Period, #contents #Deadline{
	background:#268ec2;
	padding:6px 1em;
	font-size:2rem;
	font-weight:bold;
	color:#fff;
	border:2px solid #005d8b;
}
#contents #Period{
	position:absolute;
	top:560px;
	left:14px;
}
#contents #Deadline{
	position:absolute;
	top:560px;
	right:14px;
}
#contents #Deadline span {font-size:1.6rem;}


/* nav */
#contents #navWrap{
	overflow:hidden;
	width:700px;
	margin:0 auto 30px;
}
#contents #navWrap li{
	position:relative;
	float:left;
	width:190px;
	margin:0 10px;
	font-size:1.6rem;
	font-weight:bold;
	text-align:center;
}
#contents #navWrap li::before{
	position:absolute;
	content:url(../images/nav_ribon.png);
	top:0;
	left:-11px;
}
#contents #navWrap li a{
	display:block;
	background-color:#fff;
	background-image:linear-gradient(-45deg, rgba(107, 178, 213, 0.2) 25%, transparent 25%, transparent 50%, rgba(107, 178, 213, 0.2) 50%, rgba(107, 178, 213, 0.2) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(107, 178, 213, 0.2) 25%, transparent 25%, transparent 50%,  rgba(107, 178, 213, 0.2) 50%, rgba(107, 178, 213, 0.2) 75%, transparent 75%, transparent 100%);
	background-size:12px 12px;
	padding:6px 0;
	color:#005d8b;
	text-decoration:none;
	border:2px solid #005d8b;
	border-radius:30px;
	transition:0.5s;
}
#contents #navWrap li a:hover{
	background-color:#fff;
	background-image:linear-gradient(-45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%, rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%,  rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%);
	transition:0.8s;
}


/* Hタグ */
#contents h2{
	position:relative;
	background:#268ec2;
	margin-bottom:16px;
	padding:5px 2.4em;
	font-size:2.4rem;
	font-weight:bold;
	color:#fff;
	border-bottom:4px solid #99d7ef;
}
#contents h2::before{
	content:url(../images/tit_ribon01.png);
	position:absolute;
	top:7px;
	left:8px;
}
#contents h2::after{
	content:url(../images/tit_ribon02.png);
	position:absolute;
	top:7px;
	right:8px;
}


/* 概要 */
#contents .wBox{
	background:#fff;
	width:1080px;
	margin:0 auto 50px;
	padding:1em;
	font-size:1.4rem;
	border:6px solid #99d7ef;
}
#contents .wBox p, #contents .wBox ul {margin-bottom:1.3em;}
#contents .wBox li {margin-bottom:6px;}
#contents .wBox .subTit{
	display:inline-block;
	background:#268ec2;
	margin:1.6em 0 0.8em;
	padding:0 8px;
	font-size:1.6rem;
	font-weight:bold;
	color:#fff;
	border:4px double #99d7ef;
}
.ColorRed {color:#ee475b;}
#contents .wBox .attention li{
	margin:0 0 2px 1em;
	text-indent:-1em;
	font-size:1.2rem;
}


/* 店舗写真 */
#contents .shopWrap{
	overflow:hidden;
	width:1080px;
	margin:0 0 20px;
}
#contents .shopBox{
	float:left;
	width:calc(100% / 5 - 20px);
	margin:0 10px 20px;
	text-align:center;
}
#contents .shopBox .shopName{
	background-color:#fff;
	background-image:linear-gradient(-45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%, rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%,  rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%);
	background-size:12px 12px;
	padding:4px 0;
	font-size:1.4rem;
	font-weight:bold;
	color:#268ec2;
	border:1px solid #268ec2;
	border-bottom:none;
}
#contents .shopBox .shopImg{
	display:table-cell;
	background:rgba(255, 255, 255, 0.5);
	width:196px;
	height:256px;
	text-align:center;
	vertical-align:middle;
	border:1px solid #268ec2;
}
#contents .shopBox .shopImg img{
	max-width:192px;
	max-height:254px;
}


/* Footer */
/*#contents #footerWrap{
	position:relative;
	width:100%;
	margin:0 auto;
	padding:30px 0;
}
#contents #footerWrap div {margin-bottom:12px;}
#contents #footerWrap #copyright{
	background:transparent;
	color:#000;
}
#contents #footerWrap .attention {font-size:1.1rem;}*/



/* 結果発表 */
#contents .kekka_catch{
    font-size:2.6em;
    font-weight:bold;
    text-align:center;
	color:#268ec2;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
border-bottom:solid 1px #268ec2;
}
#top .kekka_catch{
    font-size:2em;
    font-weight:bold;
    text-align:center;
	color:#268ec2;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
border-bottom:solid 1px #268ec2;
}

#contents .result {
	background:#fff;
	width:1080px;
	margin:0 auto 50px;
	padding:1em;
	font-size:1.4rem;
	border:6px solid #99d7ef;
}

.result p{
    line-height:150%;
    margin:10px 0;}

.result .result_t {text-align: center; overflow: auto;}
.result .result_t img{ height: auto;}

#contents .result .box{
    text-align:center;
    border:4px solid #99d7ef;
    width: 320px;
    float:left;
    text-align;center;
    background-color:#ffffff;
    margin:10px;}

#top .result .box{
    text-align:center;
    border:4px solid #99d7ef;
    width: 96%;
    float:left;
    text-align;center;
    background-color:#ffffff;
    margin:10px;}

.result .box .img{
    width: 100%;
    height: auto;
    text-align: center;}

.result .box .img img{
    width:auto;
    text-align;center;
    max-width: 100%;
    height: auto;
    background-color:#ffffff;
    max-height:300px;}

.result .box .tit{
    color:#268ec2;
    font-size:1.4em;
    line-height:2em;
    font-weight:bold;
    text-align: center;
    background-color:#ffffff;
    margin:10px 0 0 0;}


/*=================================
スマートフォン
=================================*/
#top #header {background:#fff !important;}
.li-box {overflow:hidden;}
.li-box > p:first-child,
.li-box > p:last-child,
#corner_name,
#corner_main_text li.title {display:none;}
.li-box section{
	background:none;
	font-size:1.2rem;
	line-height:1.5;
}
h2.search-h2 {display:none;}
#corner_sphone_banner img {max-width:640px;}
section#corner_name {display:none;}

#top #bread-crumb-list {color:#000;}

.itemsList {margin-bottom:20px;}
.itemsList li{
	height:auto;
	width:94%;
	margin:0 auto 10px;
}
.itemsList li:last-child {margin-bottom:30px;}
/*.itemsList li div > span {color:#fff;}*/

div.li-box ul li {margin:0;}

#top h2{
	-webkit-margin-before:0;
	-webkit-margin-after:0;
}


/*** カスタム ***/
.wrapper {}
div.sphone_banner img {width:100%;}
.li-box .line,
.copyright .line{
	width:100%;
	margin-bottom:10px;
	text-indent:-9999px;
}
#top .tiles {background:#fff;}
#top #bread-crumb-list a, .li-box a {color:#08162e;}
#corner_products ul.tiles li a {}
#corner_products ul.tiles:last-child {margin-bottom:20px;}
.to-top a {color:#000 !important;}

#top{
	font-family:"Noto Sans Japanese", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:url(../images/bg.jpg) center top;
	width:100%;
	margin:0 auto;
}
#top .pcOnly {display:none;}
#top * {box-sizing:border-box;}
.show-all,
.show-all a {box-sizing:inherit !important;}

div#product-detail-images div.product-deteail-image-box {display:block;}
#top #product-detail-images {margin-bottom:14px;}
div#corner_extra {display:none;}
#top .li-box{
	width:100%;
	margin:0;
}

#top .copyright > p {display:none;}


/* header */
#top #Logo, #top #Period, #top #Deadline {display:none;}


/* nav */
#top #navWrap{
	overflow:hidden;
	width:96%;
	margin:0 auto 20px;
}
#top #navWrap li{
	position:relative;
	float:left;
	width:46%;
	margin:0 2%;
	font-size:1.4rem;
	font-weight:bold;
	text-align:center;
}
#top #navWrap li a{
	display:block;
	background-color:#fff;
	background-image:linear-gradient(-45deg, rgba(107, 178, 213, 0.2) 25%, transparent 25%, transparent 50%, rgba(107, 178, 213, 0.2) 50%, rgba(107, 178, 213, 0.2) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(107, 178, 213, 0.2) 25%, transparent 25%, transparent 50%,  rgba(107, 178, 213, 0.2) 50%, rgba(107, 178, 213, 0.2) 75%, transparent 75%, transparent 100%);
	background-size:12px 12px;
	padding:6px 0;
	color:#005d8b;
	text-decoration:none;
	border:2px solid #005d8b;
	border-radius:30px;
}


/* Hタグ */
#top h2{
	position:relative;
	background:#268ec2;
	margin-bottom:10px;
	padding:5px 2.4em;
	font-size:1.6rem;
	font-weight:bold;
	color:#fff;
	text-align:center;
	border-bottom:4px solid #99d7ef;
}


/* 概要 */
#top .wBox{
	background:#fff;
	width:98%;
	margin:0 auto 20px;
	padding:1em;
	border:6px solid #99d7ef;
}
#top .wBox p {margin:0 0 1.3em;}
#top .wBox ul {margin-bottom:1.3em;}
#top .wBox li {margin-bottom:6px;}
#top .wBox .subTit{
	background:#268ec2;
	margin:1.6em 0 0.8em;
	padding:0 8px;
	font-size:1.3rem;
	font-weight:bold;
	color:#fff;
	text-align:center;
	border:4px double #99d7ef;
}
#top .wBox .attention li{
	margin:0 0 2px 1em;
	text-indent:-1em;
	font-size:1.1rem;
}


/* 店舗写真 */
#top .shopWrap{
	overflow:hidden;
	width:98%;
	margin:0 auto 20px;
}
#top .shopBox{
	float:left;
	width:calc(100% / 2 - 2%);
	margin:0 1% 10px;
	text-align:center;
}
#top .shopBox .shopName{
	background-color:#fff;
	background-image:linear-gradient(-45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%, rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(253, 231, 83, 0.4) 25%, transparent 25%, transparent 50%,  rgba(253, 231, 83, 0.4) 50%, rgba(253, 231, 83, 0.4) 75%, transparent 75%, transparent 100%);
	background-size:12px 12px;
	padding:4px 0;
	font-weight:bold;
	color:#268ec2;
	border:1px solid #268ec2;
	border-bottom:none;
}
#top .shopBox .shopName, #top .shopBox .shopImg{
	margin:0;
	margin-block-start:0;
	margin-block-end:0;
}
#top .shopBox .shopImg{
	display:table-cell;
	background:rgba(255, 255, 255, 0.5);
	width:calc(100% / 2 - 2%);
	height:256px;
	text-align:center;
	vertical-align:middle;
	border:1px solid #268ec2;
}
#top .shopBox .shopImg img{
	max-width:100%;
	max-height:242px;
}


/* footer */
/*#top #footerWrap{
	background:transparent;
	width:100%;
	padding:4px 0 1px;
}
#top #footerWrap p {margin-bottom:12px;}
#top #footerWrap #copyright{
	background:transparent;
	width:98%;
	margin:0 auto;
	font-size:1.1rem;
	color:#000;
	border:none;
}
#top #footerWrap .attention{
	width:96%;
	margin:0 auto 20px;
	font-size:1.1rem;
	color:#000;
	text-align:left;
}*/




