@charset "UTF-8";

/* PAGE of AWARD */
.wrap { background: #fbf9de;}

#award-kv { position: relative;}
#award-kv .inner-kv { position: relative; width: 100%; max-width: 1280px; margin: 0 auto;
 background: linear-gradient(70deg,#faedba,#fefaec,#faeeba);
}
#award-kv .inner-kv:after { content: ''; display: block; width: 100%; height: 140px;
 position: absolute; left: 0; bottom: 0; z-index: 1;
 background: linear-gradient(#d2c695,#eee4b4);
}
#award-kv .defhd { position: absolute; left: 0; top: 0; width: 100%; z-index: 10;}
#award-kv .defhd .inner { width: 100%; max-width: 1280px; height: 240px; margin: 0 auto; padding: 25px 50px;
 background: url('/img/bg-hd.png') no-repeat 50% 0;
}
#award-kv .defhd h1 { line-height: 1;}
#award-kv .defhd h1 svg { width: 36%; max-width: 210px; height: 50px; fill: #6a3906;}
#award-kv .ctn { position: relative; width: 100%; max-width: 800px; margin: 0 auto; padding-top: 170px; z-index: 2;}
#award-kv .ctn .ttl { margin-bottom: 30px;}
#award-kv .ctn .ttl:before { content: ''; display: block; width: 100%; height: 36px; margin-bottom: 10px;
 background: url('/img/awards/icn.png') no-repeat 50% 50% /  auto 100%;
}
#award-kv .ctn .ttl h2 { margin-bottom: 20px; color: #6a3906; font-size: 36px; letter-spacing: 0.08rem; line-height: 1.25; text-align: center;}
#award-kv .ctn .ttl p { color: #6a3906; font-size: 18px; font-weight: 700; letter-spacing: 0.06rem; text-align: center;}
#award-kv .ctn figure { text-align: center;}
#award-kv .ctn figure img { width: 100%; max-width: 700px;}
#award-kv .ctn .badge { position: absolute; right: 5%; top: 38%; width: 110px;}
#award-kv .ctn .badge img { width: 100%; border-radius: 50%;}

@media (max-width: 641px) {
	#award-kv .defhd .inner { height: 36.5vw; padding: 4.5vw 25px 0;}
	#award-kv .defhd .inner { background: url('/img/bg-hd-sp.png') no-repeat 50% 0 / 100% auto;}
	#award-kv .ctn .ttl h2 span { display: block;}
}
@media (max-width: 481px) {
	#award-kv .ctn { padding-top: 28vw;}
	#award-kv .ctn .ttl { margin-bottom: 20px;}
	#award-kv .ctn .ttl:before { height: 24px;}
	#award-kv .ctn .ttl h2 { margin-bottom: 12px; font-size: 28px;}
	#award-kv .ctn .ttl p { font-size: 14px;}
	#award-kv .ctn .badge { width: 72px; right: 2%; top: 45%;}
}




#award-board { background: linear-gradient(140deg,#e0b041,#f0c453 32%, #bc850d);}
#award-board .inner { padding: 30px 0 20px;}
#award-board h3 { margin-bottom: 12px; text-align: center;}
#award-board h3 img { width: 80%; max-width: 500px;}
#award-board p { color: #fff; font-size: 10px; text-align: center;}
#award-board p.min { font-size: 30px; font-weight: 700;}
@media (max-width: 641px) {
	#award-board p.min { font-size: 21px;}
}
@media (max-width: 481px) {
	#award-board .inner { padding: 20px 0 12px;}
	#award-board p { font-size: 9px;}
	#award-board p.min { font-size: 16px;}
}


#award {}
#award .inner-sct { padding: 80px 0;}
#award .award-nav { position: relative; z-index: 10; width: 92%; max-width: 600px; margin: 0 auto;}
#award .award-nav ul { font-size: 0; text-align: center;}
#award .award-nav ul li { position: relative; display: inline-block; width: 33.333334%; max-width: 200px; font-size: 18px; font-weight: 700; cursor: pointer;}
#award .award-nav ul li a.top{ display: block; padding: 20px 0 15px; background: #cacaca; color: #8b8b8b; text-decoration: none;}
#award .award-nav ul li a.top:hover { background: #eee;}
#award .award-nav ul li span { display: block; padding: 20px 0 15px;}
#award .award-nav ul li.not span{ background: #cacaca; color: #8b8b8b;}
#award .award-nav ul li.not span:hover { background: #eee;}
#award .award-nav ul li.on span { background: #fff; color: #6a3906;}
#award .award-nav ul li span.more{ background: #fbf9de; color: #6a3906; text-indent: -20px;}
#award .award-nav ul li span.more:after { content: ''; display: block; width: 10px; height: 10px;
 border-bottom: solid 2px #6a3906; border-right: solid 2px #6a3906;
 position: absolute; top: 50%; left: 50%; transform: translate(40px,-55%) rotate(45deg);
}
#award .award-nav ul li.past:hover span.more { background: #6a3906; color: #fff;}
#award .award-nav ul li.past:hover span.more:after { border-color: #fff; transform: translate(40px,-25%) rotate(-135deg);}
#award .award-nav ul li.past ul { display: none; position: absolute; left: 0; top: 64px; width: 100%; visibility: hidden;}
#award .award-nav ul li.past:hover ul { display: block; visibility: visible;}
#award .award-nav ul li ul li { display: block; width: 100%; border-top: solid 1px #a17a51; font-size: 18px;}

#award .award-nav ul li ul li a { position: relative; display: block; padding: 18px 0; background: #6a3906;
 color: #fff; text-decoration: none; text-indent: -15px;
}
#award .award-nav ul li ul li a:hover { background: #a17a51;}
#award .award-nav ul li ul li a:after { content: ''; display: block; width: 8px; height: 8px;
 border-top: solid 2px #fff; border-right: solid 2px #fff;
 position: absolute; top: 50%; right: 15px; transform: translateY(-50%) rotate(45deg); z-index: 2;
}
@media (max-width: 641px) {
	#award .award-nav ul li { font-size: 16px;}
	#award .award-nav ul li a.top{ display: block; padding: 15px 0 12px;}
	#award .award-nav ul li span { display: block; padding: 15px 0 12px;}
	#award .award-nav ul li.past ul { top: 52px;}
	#award .award-nav ul li ul li { font-size: 16px;}
}
@media (max-width: 481px) {
	#award .award-nav ul li { font-size: 13px;}
	#award .award-nav ul li span.more:after { width: 6px; height: 6px; transform: translate(30px,-55%) rotate(45deg);}
	#award .award-nav ul li.past:hover span.more:after { transform: translate(30px,-25%) rotate(-135deg);}
	#award .award-nav ul li.past ul { top: 48px;}
	#award .award-nav ul li ul li { font-size: 12px;}
	#award .award-nav ul li ul li a { padding: 12px 0; text-indent: -10px;}
	#award .award-nav ul li ul li a:after { width: 5px; height: 5px; right: 8px;}
}


#award .award-ctn { width: 92%; max-width: 900px; margin: 0 auto; background: #fff; padding-bottom: 40px;}
#award .award-ctn .year { display: none;}
#award .award-ctn .year.show { display: block;}
#award .award-ctn .bloc { position: relative; }
#award .award-ctn .bloc:after { content: ''; display: block; width: 100%; height: calc( 100% - 280px );
 background: linear-gradient(#eeeee9, #fff 50%);
 position: absolute; left: 0; bottom: 0;
}
#award .award-ctn .bloc.landscape:after { height: calc( 100% - 120px );}
#award .award-ctn .tit { padding: 40px 0 20px;}
#award .award-ctn .tit h3 { color: #6a3906; font-size: 30px; font-weight: 700; letter-spacing: 0.08rem; text-align: center;}
#award .award-ctn .ctn { position: relative; padding: 40px 0 20px; z-index: 2;}
#award .award-ctn .ctn figure { margin-bottom: 40px; text-align: center;}
#award .award-ctn .ctn figure img { width: 58%; max-width: 300px;}
#award .award-ctn .ctn figure img.landscape { width: 50%; max-width: 200px;}
#award .award-ctn .ctn p.name { color: #6a3906; font-size: 20px; font-weight: 700; line-height: 1.5; text-align: center;}
#award .award-ctn .ctn ul.title { margin-bottom: 12px; font-size: 0; text-align: center;}
#award .award-ctn .ctn ul.title li { padding: 6px 0; color: #6a3906; font-size: 13px; font-weight: 700; line-height: 1.4;}
#award .award-ctn .ctn ul.links { width: 80%; max-width: 380px; margin: 0 auto; font-size: 0; text-align: center;}
#award .award-ctn .ctn ul.links li { display: inline-block; width: 50%; padding: 5px; color: #6a3906; font-size: 13px;}
#award .award-ctn .ctn ul.links li a { position: relative; display: block; padding: 10px 0;
 background: #fff; border: solid 1px #6a3906; border-radius: 50px;
 color: #6c3c07; font-weight: 700; text-decoration: none;}
#award .award-ctn .ctn ul.links li a:after { content: ''; display: block; width: 8px; height: 8px;
 border-top: solid 2px #6a3906; border-right: solid 2px #6a3906;
 position: absolute; top: 50%; right: 15px; transform: translateY(-50%) rotate(45deg);
}
#award .award-ctn .ctn ul.links li a.cart { text-indent: 20px;}
#award .award-ctn .ctn ul.links li a.cart:before { content: ''; display: block; width: 16px; height: 100%;
 position: absolute; left: 50px; top: 0%; transform: translate(-6px,0%);
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"><path d="M5.7,26.5a1.06,1.06,0,0,1,0-2.11H20l.66-2.46H5.54a1.07,1.07,0,0,1-1-.77L.77,7.78A1.05,1.05,0,0,1,1,6.86a1.07,1.07,0,0,1,.84-.42h23L26.22,1a1.06,1.06,0,0,1,1-.79h5a1.07,1.07,0,0,1,1.06,1.06,1.06,1.06,0,0,1-1.06,1.05H28.05L21.81,25.72a1.05,1.05,0,0,1-1,.78Zm12.48-6.68h3l1.21-4.58H18.18Zm-7.1,0h5V15.24h-5Zm-4.74,0H9V15.24H5.06Zm11.84-6.69H23l1.21-4.58h-6Zm-7.1,0h5V8.55h-5Zm-6.62,0H9V8.55H3.18Z" transform="translate(-0.73 -0.16)" fill="%236a3906"/><path d="M7.94,33.84a3,3,0,1,1,3-3A3,3,0,0,1,7.94,33.84Zm0-3.92a.91.91,0,1,0,.9.9A.91.91,0,0,0,7.94,29.92Z" transform="translate(-0.73 -0.16)" fill="%236a3906"/><path d="M19,33.84a3,3,0,1,1,3-3A3,3,0,0,1,19,33.84Zm0-3.92a.91.91,0,1,0,.9.9A.9.9,0,0,0,19,29.92Z" transform="translate(-0.73 -0.16)" fill="%236a3906"/></svg>');
 background-repeat: no-repeat; background-position: 50% 50%; background-size: 100% auto; 
}

#award .award-ctn .ctn ul.links li form { position: relative; display: block;}
#award .award-ctn .ctn ul.links li form:after { content: ''; display: block; width: 8px; height: 8px;
 border-top: solid 2px #6a3906; border-right: solid 2px #6a3906;
 position: absolute; top: 50%; right: 15px; transform: translateY(-50%) rotate(45deg);
}

#award .award-ctn .ctn ul.links li form svg { position: absolute; left: 50%; top: 50%; transform: translate(-50px, -50%);
 width: 16px; fill: #6a3906;
}
#award .award-ctn .ctn ul.links li form input[type="submit"]{ display: block; width: 100%; padding: 10px 0;
 position: relative; z-index: 2;
 background: none; border: solid 1px #6a3906; border-radius: 50px;
 color: #6a3906; font-weight: 700;
}

#award .btn-back { width: 60%; max-width: 370px; margin: 0 auto; padding: 60px 0;}
#award .btn-back a { display: block; width: 100%;}
#award .btn-back a img { width: 100%;}

@media (max-width: 641px) {
	#award .award-ctn .tit h3 { font-size: 24px;}
}
@media (max-width: 481px) {
	#award .award-ctn .bloc:after { height: calc( 100% - 160px );}
	#award .award-ctn .bloc.landscape:after { height: calc( 100% - 80px );}

	#award .award-ctn .tit { padding: 20px 0 12px;}
	#award .award-ctn .tit h3 { font-size: 21px;}

	#award .award-ctn .ctn { padding: 30px 0 12px;}
	#award .award-ctn .ctn p.name { font-size: 16px;}
	#award .award-ctn .ctn ul.title li { padding: 4px 0; font-size: 12px;}
	#award .award-ctn .ctn ul.links li { font-size: 12px;}
	#award .award-ctn .ctn ul.links li a { padding: 5px 0;}
	#award .award-ctn .ctn ul.links li a:after { width: 5px; height: 5px;}
	#award .award-ctn .ctn ul.links li a.cart:before { width: 12px;}
	#award .award-ctn .ctn ul.links li form:after { width: 5px; height: 5px;}
	#award .award-ctn .ctn ul.links li form svg { width: 12px;}
	#award .award-ctn .ctn ul.links li form input[type="submit"]{ padding: 5px 0;}
}