﻿@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea,{
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

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

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}

.clearfix:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*ﾂ･*//*/
	height: auto;
	overflow: hidden;
	/**/
}

.both{
	clear:both;
}

.inline_block {  
	display: inline-block;  
	*display: inline;  
	*zoom: 1;  
}
/* よく使うCSS start*/

img {
	max-width:100%;
}

table {
	width:100%;
}

a,a:hover,a:before,a:after,a:hover:before,a:hover:after {
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;
}

a img:hover {
	filter: alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;
}


*,*:before,*:after{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

/*--body--*/
body{position:relative;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
-webkit-text-size-adjust: 100%;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
/*background:#6cbb5a;*/
/*font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
*/
width: 98.5vw;
overflow: hidden;
}


a{color:#a00a; text-decoration:none;}
a:hover{color:#f2b254;}
/*a:visited{color:#999;}*/

.pc{display:block;}
.smp{display:none;}

.f_l{float:left;}
.f_r{float:right;}

.ind1{text-indent:1em;}
.sml{font-size:.72em;}
.bold{font-weight:bold;}

.mt1{margin-top:1em;}
.mt2{margin-top:2em;}
.mt3{margin-top:3em;}
.mt4{margin-top:4em;}

.mb1{margin-bottom:1em}
.mb2{margin-bottom:2em;}
.mt3{margin-top:3em;}
.mt4{margin-top:4em;}

.fz_08{font-size:80%;}
.fz_12{font-size:120%;}

.red{color:#F00;}

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

section a[href$="pdf"]:after{content:url(/image/icons/icon_pdf.gif);margin-left:.5em;position:relative;top:2px}
section a[href$="doc"]:after,a[href$="docx"]:after{content:url(/image/icons/icon_doc.gif);margin-left:.5em;position:relative;top:2px}
section a[href$="xls"]:after,a[href$="xlsx"]:after{content:url(/image/icons/icon_xls.gif);margin-left:.5em;position:relative;top:2px}

.marugo{font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}
.mincho{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}
img{display:block;max-width:100%;margin:0 auto}

ol.deci{list-style: decimal;margin-left:2em}
.wrap{width:1000px;margin:0 auto}
.flex{display:flex;margin:0 auto;justify-content:space-between;flex-wrap:wrap}
.flex.col3,.flex.col4{justify-content:flex-start}

.col3 li{width:32%;margin-right:2%}
.col3 li:nth-of-type(3n){margin-right:0}
.col4 li{width:23%;margin-right:2%}
.col4 li:nth-of-type(4n){margin-right:0}

article{margin:0 auto}

/*--header--*/
header{/*background: #6cbb5a;*/position:relative;z-index:0}
header h2{text-align:center;color:#6cbb5a;font-size:calc(100vw / 12);letter-spacing:2vw;line-height:.6em;padding-top:1em;z-index:1}
header h1{color:#fff;font-size:4em;z-index:1;background:#6cbb5a;line-height:1em;padding:.2em 0 0 15%;position:relative}
header h1:before{content:url(../img/common/mark.svg);display:inline-block;width:15%;max-width:150px;position:absolute;top:0;left:0}
header h1 span{display:block;font-size:.5em;line-height:1.4em}
header ul.head{position:absolute;top:0;max-height:220px;overflow:hidden;z-index:-1}
header ul.head li{height:auto;max-height:220px}
header ul.head img{object-fit:contain;max-height:220px}

/*--gmenu--*/
.gmenu{margin:0 auto;background:#6cbb5a}
.gmenu>ul{margin:-.5em 0 0 auto;padding:0;display:flex;justify-content:space-between;align-items:center;background:#f6ad3c;width:50%;min-width:500px}
.gmenu li{text-align:center;position:relative;margin:0 .5em;width:calc(90% / 4)}
.gmenu li:first-child{width:10%}
.gmenu ul li a{font-weight:bold;line-height:1.4em;font-size:1em;display:block;color:#fff;}

.gmenu .top img{width:2em;object-fit:contain}

.gmenu li a:hover,
.cheer .cheer a,.present .present a,.tax .tax a,.memb .memb a{
    padding-top:1em;margin-top:-1em;border-radius:50% 50% 0 0
}
.cheer li.cheer a,.gmenu li.cheer a:hover{background:#e85298}
.present li.present a,.gmenu li.present a:hover{background:#00afec}
.tax li.tax a,.gmenu li.tax a:hover{background:#f08437}
.memb li.memb a,.gmenu li.memb a:hover{background:#4caf50}

/*--section--*/
section{padding:2em 1em;position:relative}
dl.period{margin:1em auto;display:flex;flex-wrap: wrap;justify-content: center;font-size:1.2em;}
dl.period dt{background:#6cbb5a;color:#fff;font-weight:bold;padding:0 1em}
dl.period dd{padding-left: 1em}

ul.goods{margin:2em auto;display:flex;flex-wrap:wrap;}
ul.goods li{width:30%;margin:1%;padding:1%;position:relative;background:#fff;border:1px #999 solid;border-radius:.2em}
ul.goods li figure{text-align:center;overflow:hidden;margin-bottom:0}
ul.goods li img{margin-bottom:1em;transition:.4s}
ul.goods li:hover img{transform:scale(1.1)}
ul.goods p.badge{position:absolute;top:-1em;right:-.5em;width:4em;height:4em;background:#faf338;color:#ff0e00;line-height:3.5em;aspect-ratio:1;border-radius:50%;text-align:center}
ul.goods p.badge b{font-weight:bold;font-size:1.2em}
ul.goods li h3{position:relative;width:90%;margin:0 auto ;height:4em;/*top:-1.5em;*/font-size:1.2em;color:#fff;background:url(../img/present/ribbon.svg)center no-repeat;background-size:cover;padding-top:.8em}
ul.goods li h3 span{display:block;font-size:.6em}
/*ul.goods p.badge+p{margin: -1em auto 0}*/
ul.goods li input{visibility:hidden}
ul.goods li input:checked+label{display:block;padding:.2em;background:rgba(255,0,0,.5);z-index:+1;transition:.4s;border-radius:.2em}
input:checked+label p.badge+p{color:#fff}
ul.goods li input:checked+label:before{content:"";position:absolute;width:1em;height:2em;display:inline-block;border-right:2px #f00 solid;border-bottom:2px #f00 solid;top:0;left:0;right:0;margin:auto;transform:rotate(45deg);z-index:+1;}

h2.ttl{background:#1c7ec0;border-bottom:1px #1c7ec0 solid;color:#fff;font-size:1.5em;font-weight:bold;text-align:center;margin:1em auto;padding:.5em;position:relative}
h2.ttl:before{content:url(../img/common/mark.svg);display:inline-block;width:10%;max-width:150px;position:absolute;top:-1em;left:0}

h3.ttl{font-size:1.2em;font-weight:bold;color:#1c7ec0;border-bottom:1px #1c7ec0 solid;margin:1em auto}

h4.ttl{margin:1em auto;border-bottom:3px #ffc107 solid;font-weight:bold;font-size:1.2em;}
ul.atte{margin:1em auto;width:90%;padding:1em 2em;list-style:square;border:3px #f00 double;border-radius:1em;}
ul.atte.kome{list-style:none;}
p.ind{text-indent:1em}

/*--footer--*/
footer{background:#1c7ec0;}
footer dl{display:flex;flex-wrap:wrap;align-items: flex-start;padding:1em 0}
footer dt{width:6em;color:#1c7ec0;background:#fff;text-align:center}
footer dd{color:#fff;padding-left:1em}

p.gotop{position:fixed;z-index: 99;bottom: -60px;right: 50px;transition:.4s}
p.gotop a{display:inline-block;text-align:center;color:#ff8702;font-size:.8em;height:40px;width:48px;background:#f2b254;position:relative}
p.gotop a:before{content:"";display:block;width:20px;margin:0 auto;border:10px transparent solid;border-bottom:15px #fff solid;position:relative;}
p.gotop a:hover{color:#ff6d78;}
p.gotop a:hover:before{border-bottom-color:#ff6d78;margin-bottom:.5em}

small{display:block;padding:1em 0;text-align:center;color:#fff;border-top:2px #1c7ec0 solid;background:#1c7ec0}


@media screen and (max-width: 741px){ 
.wrap{width:100%}
header h1{padding-bottom:.2em;padding-left:120px}
header h1:before{width:120px;}
header ul.head img{max-height:100px}
.gmenu>ul{width:auto}
h2.ttl:before{width:95px}
    
ul.goods li{width:48%}    
}

@media screen and (max-width: 540px){ 
.pc{display:none;}
.smp{display:block;}
.f_l,.f_r{float:none;}


.flex.col3,.flex.col4{justify-content:space-between}
.col3 li,.col4 li{width:49%;margin-right:0}
ul.goods li h3{font-size:1em} 
    
/*--header--*/
header h2{text-align:left;text-indent:1em;font-size:calc(100vw / 15)}
header h1{font-size:9.5vw}
    
/*--sider menu--*/    
.smp .slide-menu{width:64px; height:64px; display:block; position:fixed; top:12px; right:1em; background:#f08200; color:#FFF; padding:.5em;font-size:.8em; text-align:center;z-index:1000; text-decoration:none}
.smp a.slide-menu span{height:3px; width:95%; background:#fff; display:block; margin:.2em auto 2em; position:relative;}
.smp a.slide-menu span:before{content:"";height:3px;width:100%; background:#fff; display:block;top:8px; position:relative}
.smp a.slide-menu span:after{content:"";height:3px;width:100%; background:#fff; display:block;top:13px; position:relative}
.smp a.slide-menu:hover{background:#88181c;}

    
/*--section--*/ 
h2.ttl:before{width:12vw;top:0}
dl.period dd{padding-left:0}

/*--footer--*/
footer{margin-top:4em;padding-top:.5em}
p.gotop{right:0}
footer address a{padding:0 .5em;background:#fff;border:1px #fff solid;border-radius:.5em;text-align:center}
footer address a:hover{background:none;color:#fff}
}


span.end{background:#f00;color:#fff;font-weight:bold;padding:.2em .5em}