@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

/* CSS Document */
*{ margin:0; padding:0; box-sizing:border-box; word-break:break-all;}
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
ul,ol{ list-style:none;}
html,body {
margin:0 auto;
padding:0;
font-family: 'Noto Sans JP',"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
font-size:20px;
text-align:left;
color:#333;
background: #efefef;
min-width:1080px;
}
@media screen and (max-width:768px){
html,body{ font-size:4vw; min-width:240px; max-width:767px;}
}

/*img*/
img{ border-style:none; vertical-align:bottom; padding:0; line-height:0em; max-width:100%; height:auto;}
figure{margin:0 auto; text-align:center;}
figure.img img{ padding:8px; background:#fff; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px;}
@media screen and (max-width:768px){
figure.img img{ padding: 1.25vw;}
}


/*txt*/
p{ line-height:1.75em; margin:0 0 1em; padding:0;}
p:last-child{ margin:0;}
strong{ font-weight:bold;}
.bold { font-weight:bold;}
.normal{ font-weight:normal;}
.under_line{ text-decoration:underline;}
.line_through{ text-decoration:line-through;}

.left{ text-align:left;}
.right{ text-align:right;}
.center{ text-align:center;}

/*link*/
a{ color:inherit; text-decoration:none;}
a:hover{}
.opa{ transition: opacity 0.3s;}
.opa:hover{ opacity: 0.7;}



/*ヘッダー*/
header{ max-width: 1080px; margin: auto;}
@media screen and (max-width:768px){
header{ max-width: 100%;}
}

/*フッター*/
footer{ background: #fff; padding: 60px; border-top: 1px solid #333;}
footer .insta{ text-align: center; padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px dotted #333;}
footer .insta a{ transition: 0.3s;}
footer .insta a:hover{ opacity: 0.7;}
footer .insta figure{ margin-bottom: 10px;}
footer .insta h4{ font-size: 1rem; margin-bottom: 20px;}
footer .insta p{ text-align: center; font-size: 0.8rem;}
footer .comp dl{ display: flex; align-items: center; justify-content: center; margin: 0 auto 20px;}
footer .comp dl dt{ width: 60px;}
footer .comp dl dd{ display: flex; flex-direction: column; margin-left: 20px;}
footer .comp dl dd span{ font-size: 0.8rem; letter-spacing: 0.1em;}
footer .comp dl dd strong{ font-size: 1.2rem; letter-spacing: 0.1em;}
footer .comp p{ text-align: center; line-height: 1.5em; font-size: 0.8rem;}
@media screen and (max-width:768px){
footer{ padding: 7.5%;}
footer .insta{ padding-bottom: 5%; margin-bottom: 5%;}
footer .insta figure{ margin-bottom: 2.5%;}
footer .comp dl{ margin: 0 auto 5%;}
footer .comp dl dt{ width: 10vw;}
footer .comp dl dd{ margin-left: 2.5vw;}
}

/*メイン*/
#wrapper{ width: 1080px; margin: 0 auto; background: #fff; box-shadow:rgba(0, 0, 0, 0.1) 0 0 10px 5px;}
#content{ overflow:hidden;}
section{ width:100%; margin: 60px auto 120px; padding:0;}
.maincontent{ padding:0; margin:0 auto; width: 960px;}
@media screen and (max-width:767px){
#wrapper{ width: 100%;}
section{ margin: 10% auto 15%;}
.maincontent{ padding:0; margin:0 auto; width:92.5%;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.25em; letter-spacing: 0.1em;}
h2.tit{ background: #dcbe46; color: #fff; text-align: center; font-size: 3rem; padding: 0.33em 0 0.5em; position: relative; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px;}
h2.tit:before{ content: ""; background: linear-gradient(to right,  #dcbe46 0%,#ffffff 50%,#dcbe46 100%); width: 100%; height: 10px; position: absolute; left: 0; top: 0; opacity: 0.5;}
h2.tit:after{ content: ""; background: linear-gradient(to right,  #dcbe46 0%,#ffffff 50%,#dcbe46 100%); width: 100%; height: 10px; position: absolute; left: 0; bottom: 0; opacity: 0.5;}
@media screen and (max-width:768px){
h1,h2,h3,h4,h5,h6{ letter-spacing: 0;}
h2.tit{ font-size: 2rem;}
h2.tit:before{ height: 1.25vw;}
h2.tit:after{ height: 1.25vw;}
}



/*lead*/
#lead h3{ background: #dcbe46; color: #fff; text-align: center; font-size: 2.4rem; padding: 0.33em 0 0.5em; position: relative; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px;}
#lead h3:before{ content: ""; background: linear-gradient(to right,  #dcbe46 0%,#ffffff 50%,#dcbe46 100%); width: 100%; height: 10px; position: absolute; left: 0; top: 0; opacity: 0.5;}
#lead h3:after{ content: ""; background: linear-gradient(to right,  #dcbe46 0%,#ffffff 50%,#dcbe46 100%); width: 100%; height: 10px; position: absolute; left: 0; bottom: 0; opacity: 0.5;}
#lead ul{ border: 10px solid #dcbe46; border-top: none; padding: 40px;}
#lead ul li{ border-bottom: 2px dotted #333; font-size: 1.2rem; line-height: 1.5em; font-weight: bold; letter-spacing: 0.1em;}
#lead ul li:first-child{ border-top: 2px dotted #333;}
#lead ul li i{ position: absolute; left: 0.5em; top: 0.5em; line-height: 1.5em;}
#lead ul li a{ display: block; padding: 0.5em 0.5em 0.5em 1.75em; position: relative; transition: 0.3s;}
#lead ul li a:hover{ color: #dcbe46;}
@media screen and (max-width:768px){
#lead h3{ font-size: 2rem;}
#lead h3:before{ height: 1.25vw;}
#lead h3:after{ height: 1.25vw;}
#lead ul{ border-width: 2.5vw; padding: 3.75%;}
#lead ul li{ font-size: 1rem; left: 0;}
}



/*semi*/
.semi_box{ margin: 60px auto; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px;}
.semi_box .semi_tit{ background: #dcbe46; color: #fff; text-align: center;}
.semi_box .semi_tit h3{ font-size: 2.4rem; padding: 0.33em 0.5em 0.5em;}
.semi_box .semi_tit h3 span{ display: block; background: #fff; padding: 0.25em; color: #dcbe46; font-size: 50%; line-height: 1.25em; margin-top: 0.5em;}
.semi_box .semi_cont{ border: 10px solid #dcbe46; border-top: none; padding: 20px;}
.semi_box .semi_cont h4{ display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; font-size: 1.8rem; color: #dcbe46; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #dcbe46;}
.semi_box .semi_cont h4 span{ font-size: 80%; position: relative;}
.semi_box .semi_cont h4 span:before{ content: "～"; position: absolute; left: -1.25em; top: 50%; transform: translateY(-50%);}
.semi_box .semi_cont h4 span:after{ content: "～"; position: absolute; right: -1.25em; top: 50%; transform: translateY(-50%);}
.semi_box .semi_cont p.txt{ text-align: center; font-weight: bold; font-size: 1rem;}
@media screen and (max-width:768px){
.semi_box{ margin: 15% auto;}
.semi_box .semi_tit h3{ font-size: 1.5rem;}
.semi_box .semi_tit h3 span{ font-size: 66.66%;}
.semi_box .semi_cont{ border-width: 2.5vw; padding: 3.75%;}
.semi_box .semi_cont h4{ font-size: 1.33rem; margin-bottom: 5%; padding-bottom: 2.5%;}
.semi_box .semi_cont h4 span{ line-height: 1.25em; margin-top: 0.25em;}
.semi_box .semi_cont p.txt{ font-size: 0.9rem; text-align: justify;}
}

.semi_box .semi_cont dl{ display: flex; justify-content: space-between;}
.semi_box .semi_cont dl dt{ width: calc(100% - 260px);}
.semi_box .semi_cont dl dd{ width: 240px;}
.semi_box .semi_cont dl dd figure img{ border-radius: 20px;}
.semi_box .semi_cont dl dd p{ text-align: center; font-size: 0.75rem; font-weight: bold; line-height: 1.5em; margin-top: 1em;}
.semi_box .semi_cont dl dt .date{ background: #faf6e5; padding: 0.5em 0; font-size: 1rem; margin-bottom: 20px;}
.semi_box .semi_cont dl dt .date table{ border-collapse: separate; border-spacing: 1em 0.5em; font-weight: bold;}
.semi_box .semi_cont dl dt .date table th{ text-align: center; vertical-align: middle; background: #dcbe46; color: #fff; padding: 0.33em 0.3em 0.3em; line-height: 1em;}
.semi_box .semi_cont dl dt .date table td{ vertical-align: middle;}
.semi_box .semi_cont dl dt h5{ text-align: center; margin-bottom: 10px; font-size: 1.2rem; margin-top: 20px;}
.semi_box .semi_cont dl dt h6{ background: #dcbe46; color: #fff; font-size: 1.6rem; padding: 0.33em 0.5em 0.5em; margin-top: 2px;}
.semi_box .semi_cont dl dt p.txt{ text-align: justify;}
.semi_box .semi_cont dl dt ul{ font-size: 1rem; font-weight: bold; text-align: justify;}
.semi_box .semi_cont dl dt ul li{ padding: 0.5em 0.5em 0.5em 1.75em; border-bottom: 1px dotted #333; line-height: 1.5em; position: relative;}
.semi_box .semi_cont dl dt ul li:first-child{ border-top: 1px dotted #333;}
.semi_box .semi_cont dl dt ul li i{ position: absolute; left: 0.5em; top: 50%; transform: translateY(-50%); line-height: 1.5em;}
.semi_box .semi_cont dl dt ol{ font-size: 1rem; font-weight: bold; text-align: justify;}
.semi_box .semi_cont dl dt ol li{ padding: 0.5em 0.5em 0.5em 1.75em; border-bottom: 1px dotted #333; line-height: 1.5em; position: relative;}
.semi_box .semi_cont dl dt ol li:first-child{ border-top: 1px dotted #333;}
.semi_box .semi_cont dl dt ol li span{ position: absolute; left: 0.5em; top: 50%; transform: translateY(-50%); line-height: 1.5em;}
@media screen and (max-width:768px){
.semi_box .semi_cont dl{ display: block;}
.semi_box .semi_cont dl dt{ width: 100%; margin-bottom: 5%;}
.semi_box .semi_cont dl dd{ width: 100%;}
.semi_box .semi_cont dl dd figure img{ width: 66.66%; border-radius: 2.5vw;}
.semi_box .semi_cont dl dd p{ font-size: 0.75rem;}
.semi_box .semi_cont dl dt .date{ font-size: 1rem; padding: 0.5em 0.5em 0; margin-bottom: 5%;}
.semi_box .semi_cont dl dt .date table{ width: 100%; border-collapse: collapse; border-spacing: 0;}
.semi_box .semi_cont dl dt .date table th{ display: block; width: 100%; padding: 0.33em 0.5em 0.5em; font-size: 1.2rem;}
.semi_box .semi_cont dl dt .date table td{ display: block; width: 100%; padding: 0.33em 0.5em 0.5em; text-align: center; font-size: 1.0rem;}
.semi_box .semi_cont dl dt h5{ margin-bottom: 2.5%; margin-top: 5%;}
.semi_box .semi_cont dl dt h6{ font-size: 1rem;}
.semi_box .semi_cont dl dt ul{ font-size: 0.9rem;}
.semi_box .semi_cont dl dt ol{ font-size: 0.9rem;}
}

.semi_box .semi_cont .senryu{ margin: 20px auto; padding: 20px; background: #faf6e5;}
.semi_box .semi_cont .senryu ul{ font-size: 1.2rem; line-height: 1.5em;}
.semi_box .semi_cont .senryu ul li{ display: flex; justify-content: space-between; border-bottom: 1px solid #333; padding: 0.5em 1em;}
.semi_box .semi_cont .senryu ul li:first-child{ border-top: 1px solid #333;}
.semi_box .semi_cont .senryu ul li span{ display: flex; align-items: center; justify-content: center; background: #dcbe46; color: #fff; padding: 0.33em 1em 0.5em; font-size: 1rem; line-height: 1em; border-radius: 2em;}
.semi_box .semi_cont h6.theme{ text-align: center; font-size: 1.6rem; margin-top: 20px;}
@media screen and (max-width:768px){
.semi_box .semi_cont .senryu{ margin: 5% auto; padding:  2.5%;}
.semi_box .semi_cont .senryu ul{ font-size: 0.9rem;}
.semi_box .semi_cont .senryu ul li{ display: block; text-align: right; padding: 0.5em;}
.semi_box .semi_cont .senryu ul li strong{ display: block; text-align: left;}
.semi_box .semi_cont .senryu ul li span{ display: inline-block; margin: 2.5% 0 0; font-size: 0.75rem;}
.semi_box .semi_cont h6.theme{ font-size: 1.25rem; margin-top: 5%;}
}

.semi_box .semi_cont figure.semi_btn{ margin-top: 20px;}
.semi_box .semi_cont figure.semi_btn a{ display: flex; align-items: center; justify-content: center; background: #3cb43c; color: #fff; font-size: 1.6rem; letter-spacing: 0.1em; font-weight: bold; padding: 0.33em 0.5em 0.5em; position: relative; z-index: 1; transition: 0.3s;}
.semi_box .semi_cont figure.semi_btn a i{ margin-right: 0.5em;}
.semi_box .semi_cont figure.semi_btn a:after{ content: ""; width: 100%; height: 50%; background: rgba(255,255,255,0.1); position: absolute; left: 0; top: 0; z-index: -1;}
.semi_box .semi_cont figure.semi_btn a:hover{ opacity: 0.7;}
@media screen and (max-width:768px){
.semi_box .semi_cont figure.semi_btn{ margin-top: 5%;}
.semi_box .semi_cont figure.semi_btn a{ font-size: 1.2rem;}
}



/*follow*/
#follow h3{ background: #dcbe46; color: #fff; font-size: 1.2rem; padding: 0.33em 0.5em 0.5em; border: 4px double #fff; text-align: center; margin: 60px auto 20px;}
#follow h4{ text-align: center; font-size: 1rem; line-height: 1.5em;}
#follow ul{ margin: 20px;}
#follow ul li{ font-size: 1rem; line-height: 1.5em; padding: 0.5em 0.5em 0.5em 1.75em; border-bottom: 1px dotted #333; position: relative;}
#follow ul li:first-child{ border-top: 1px dotted #333;}
#follow ul li i{ position: absolute; left: 0.5em; top: 0.5em; line-height: 1.5em;}
@media screen and (max-width:768px){
#follow h3{ font-size: 1.2rem; margin: 15% auto 2.5%;}
#follow h4{ font-size: 0.8rem;}
#follow ul{ margin: 3.75%;}
#follow ul li{ font-size: 0.8rem;}
}

#follow figure.follow_btn{ margin-top: 20px;}
#follow figure.follow_btn a{ display: flex; align-items: center; justify-content: center; background: #3cb43c; color: #fff; width: 400px; margin: auto; font-size: 1.2rem; letter-spacing: 0.1em; font-weight: bold; padding: 0.33em 0.5em 0.5em; position: relative; z-index: 1; transition: 0.3s;}
#follow figure.follow_btn a i{ margin-right: 0.5em;}
#follow figure.follow_btn a:after{ content: ""; width: 100%; height: 50%; background: rgba(255,255,255,0.1); position: absolute; left: 0; top: 0; z-index: -1;}
#follow figure.follow_btn a:hover{ opacity: 0.7;}
@media screen and (max-width:768px){
#follow figure.follow_btn{ margin-top: 5%;}
#follow figure.follow_btn a{ width: 100%; font-size: 1rem; padding: 0.75em;}
}



@media print, screen and (min-width:768px){
.smp{ display:none !important;}
}
@media screen and (max-width:767px){
.pc{ display:none !important;}
}