@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;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, 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;}
strong { font-size:70%; }
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:#3c281e;
min-width:1080px;
}
@media screen and (max-width:767px){
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.1) 0 0 5px 2px;}
@media screen and (max-width:767px){
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;}

.mincho{ font-family: 'Noto Serif JP', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif;}
.white{ color:#fff;}
.black{ color:#333;}
.gy{ color:#aaa;}
.red{ color:#c83232;}
.blue{ color:#326496;}

.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;}



/*ヘッダー*/
body{ padding-top: 80px;}
header{ position: fixed; left: 0; right: 0; top: 0; z-index: 99; background: #fdc4c4; width: 100%; min-width: 1080px; padding: 10px; margin: auto; display: flex; align-items: center; justify-content: space-between; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px;}
header h1 img{ height: 60px;}
header nav{ margin: 0 0 0 auto; background: #ffd2d2; border-radius: 30px;}
header nav ul{ display: flex; align-items: center; justify-content: flex-end; height: 60px; padding: 10px 20px; font-size: 0.8rem;}
header nav ul li{ margin: 0 1em;}
/*
header nav ul li:after{ content: "|"; margin: 0 1em;}
header nav ul li:last-child:after{ display: none;}
*/
header nav ul li a{ display: inline-block; position: relative;}
header nav ul li a:after{ content: ""; width: 0; height: 1px; background: #3c281e; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; transition: 0.3s;}
header nav ul li a:hover:after{ width: 100%;}
@media print, screen and (min-width:768px){
header nav{ display: block !important; opacity: 1.0 !important; height: auto !important;}
#smp_nav_btn{ display: none !important;}
}
@media screen and (max-width:767px){
body{ padding-top: 10vw;}
header{ min-width: 100%; padding: 1.25vw;}
header h1{ width: auto; margin: 0;}
header h1 img{ width: auto; height: 7.5vw;}
header nav{ display: none; position: fixed; left: 0; right: 0; top: 10vw; /*display: flex;*/ align-items: center; justify-content: center; width: 100%; height: calc(100vh - 10vw); background: rgba(255,255,255,0.95); overflow-x: hidden; overflow-y: auto; border-radius: 0; z-index: 90;}
header nav ul{ display: block; width: 90%; height: auto; margin: 0; padding: 0;}
header nav ul li{ width: 100%; font-size: 1.2rem; text-align: center; border-bottom: 1px solid #3c281e; margin: 0;}
header nav ul li:first-child{ border-top: 1px solid #3c281e;}
header nav ul li a{ display: block; padding: 0.5em;}
header nav ul li:after,
header nav ul li:before{ display: none;}
header nav ul li a:after{ display: none;}

#smp_nav_btn{ display: flex; align-items: flex-end; justify-content: center; padding: 0; width: 10vw; height: 10vw; position: fixed; right:1.25vw; top:0; z-index:999; transition:0.3s; cursor:pointer;}
#smp_nav_btn span{ display:block; height:1px; width:7.5vw; background:#3c281e; position:absolute; left:0; right:0; top: 50%; transform: translateY(-50%); margin:auto; transition:0.3s;}
#smp_nav_btn span:before{ content: ""; display:block; height:1px; width:7.5vw; background:#3c281e; position:absolute; bottom:1.875vw; transition:0.3s;}
#smp_nav_btn span:after{ content: ""; display:block; height:1px; width:7.5vw; background:#3c281e; position:absolute; top:calc(1.875vw + 1px); transition:0.3s;}
#smp_nav_btn.active span{ background:rgba(255,255,255,0);}
#smp_nav_btn.active span:before{ bottom:0; transform: rotate(45deg);}
#smp_nav_btn.active span:after{ top:0; transform: rotate(-45deg);}
}

/*フッター*/
footer nav{ padding: 20px 0; background: #ffd2d2;}
footer nav ul{ display: flex; align-items: center; justify-content: center; margin: auto; font-size: 0.8rem;}
footer nav ul li:after{ content: "|"; margin: 0 1em;}
footer nav ul li:first-child:before{ content: "|"; margin: 0 1em;}
footer nav ul li a{ display: inline-block; position: relative;}
footer nav ul li a:after{ content: ""; width: 0; height: 1px; background: #3c281e; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; transition: 0.3s;}
footer nav ul li a:hover:after{ width: 100%;}
footer .logo{ background: #fdc4c4; padding: 20px;}
footer .logo img{ height: 80px;}
footer p.copyright{ background: #cf7daa; color: #fff; text-align: center; font-size: 0.6rem; line-height: 1em; padding: 1em;}
@media screen and (max-width:767px){
footer nav{ padding: 5vw 2.5vw;}
footer nav ul{ flex-wrap: wrap; font-size: 0.8rem; margin: -1.25vw 0;}
footer nav ul li{ border-right: 1px solid #3c281e; margin: 1.25vw 0;}
footer nav ul li:nth-child(1),
footer nav ul li:nth-child(5){ border-left: 1px solid #3c281e;}
footer nav ul li:after,
footer nav ul li:before{ display: none;}
footer nav ul li{ width: 25%; text-align: center;}
footer nav ul li:nth-child(n+5){ width: 33.33%;}
footer .logo{ padding: 5vw 2.5vw;}
footer .logo img{ height: 15vw;}
}

/*fixed_ban*/
#fixed_ban img{ width: 250px; position: fixed; right: 0; bottom: 0; margin: 0; z-index: 50; box-shadow:rgba(0, 0, 0, 0.2) 0 0 5px 2px; transition: 0.3s}
#fixed_ban.negative img{ opacity: 0; pointer-events: none;}
@media screen and (max-width:767px){
#fixed_ban img{ width: 100%; bottom: 0;}
}

/*メイン*/
#content{ overflow:hidden;}
section{ width:100%; margin:30px auto;}
.maincontent{ padding:0; margin:0 auto; width:1000px;}
@media screen and (max-width:767px){
section{ margin: 5% auto;}
.maincontent{ padding:0; margin:0 auto; width:90%;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ line-height: 1.25em; letter-spacing: 0.1em; font-family:  'メイリオ', Meiryo,'Noto Serif JP', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', serif;}
h2.tit_h2{ text-align: center; background: #cf7daa; color: #fff; font-size: 2.4rem; padding: 0.25em; border: 8px double #fff; margin-bottom: 40px; position: relative;}
h2.tit_h2:before{ content: ""; width: 0; height: 0; border-style: solid; border-color: #ffffff transparent transparent transparent; border-width: 20px 20px 0px 0px; position: absolute; left: 10px; top: 10px;}
h2.tit_h2:after{ content: ""; width: 0; height: 0; border-style: solid; border-color: transparent transparent #ffffff transparent; border-width: 0px 0px 20px 20px; position: absolute; right: 10px; bottom: 10px;}
@media screen and (max-width:767px){
h1,h2,h3,h4,h5,h6{ letter-spacing: 0;}
h2.tit_h2{ font-size: 2rem; border: 1.25vw double #fff; margin-bottom: 7.5%;}
h2.tit_h2:before{ border-width: 2.5vw 2.5vw 0px 0px; position: absolute; left: 1.25vw; top: 1.25vw;}
h2.tit_h2:after{ border-width: 0px 0px 2.5vw 2.5vw; position: absolute; right: 1.25vw; bottom: 1.25vw;}
}



/*home*/
/*fv*/
/*#fv{ background: url("../images/panda_top.jpg") center bottom no-repeat; background-size: cover; height: 600px; border: 20px solid #fff; border-bottom: none;}*/
@media screen and (max-width:767px){
#fv{ background: none; height: auto; border-width: 1.25vw;}
}

/*home_nav*/
#home_nav{ margin-top: 40px;}
#home_nav ul{ display: flex; align-items: center; flex-wrap: wrap; width: calc(100% + 20px); margin: -20px 0 -20px -10px;}
#home_nav ul li{ width: calc(33.33% - 20px); margin: 20px 10px;}
#home_nav ul li a{ display: flex; align-items: center; justify-content: center; background: #ffd2d2; width: 100%; padding: 10px 10px 10px 30px; font-size: 1.5rem; position: relative; border-radius: 2em; z-index: 1; box-shadow:rgba(0, 0, 0, 0.1) 0 0 5px 2px;}
#home_nav ul li a:after{ content: ""; width: 100%; height: 50%; border-radius: 2em 2em 0 0; background: rgba(255,255,255,0.2); position: absolute; left: 0; right: 0; top: 0; z-index: -1;}
#home_nav ul li a span{ line-height: 0; position: absolute; left: 10px; top: 50%; transform: translateY(-50%);}
#home_nav ul li a span img{ width: 40px;}
@media screen and (max-width:767px){
#home_nav{ margin-top: 10%;}
#home_nav ul{ width: calc(100% + 2.5vw); margin: -2.5vw 0 -2.5vw -1.25vw;}
#home_nav ul li{ width: calc(50% - 2.5vw); margin: 2.5vw 1.25vw;}
#home_nav ul li a{ padding: 1.25vw 1.25vw 1.25vw 3.75vw; font-size: 1.2rem;}
#home_nav ul li a span{ left: 10px; top: 50%; transform: translateY(-50%);}
#home_nav ul li a span img{ width: 5vw;}
}



/*lead*/
.lead figure.img{ margin: 40px auto;}
.lead p.sign{ margin-top: 40px; text-align: right; font-size: 1.2rem; letter-spacing: 0.1em; font-style: italic;}
@media screen and (max-width:767px){
.lead figure.img{ margin: 7.5% auto;}
.lead p.sign{ margin-top: 7.5%;}
}



/*staff*/
.staff #staff_list dl{ margin: 0 auto; display: flex; align-items: center; justify-content: space-between;}
.staff #staff_list dl:nth-child(2n){ flex-direction: row-reverse;}
.staff #staff_list dl dt{ width: 320px;}
.staff #staff_list dl dd{ width: 640px;}
.staff #staff_list dl dd h3{ display: flex; align-items: center; justify-content: center; background: #ffd2d2; width: 100%; padding: 0.5em; font-size: 1.5rem; margin-bottom: 20px; position: relative; z-index: 1;}
.staff #staff_list dl dd h3:after{ content: ""; width: 100%; height: 50%; background: rgba(255,255,255,0.2); position: absolute; left: 0; right: 0; top: 0; z-index: -1;}
.staff #staff_list dl dd h3 span{ margin-right: 1em; font-size: 75%;}
.staff #staff_list dl dd p{ text-align: justify;}
@media screen and (max-width:767px){
.staff #staff_list dl{ margin: 10% auto; display: block;}
.staff #staff_list dl dt{ width: 100%; margin-bottom: 5%;}
.staff #staff_list dl dd{ width: 100%;}
.staff #staff_list dl dt img{ width: 66.66%;}
.staff #staff_list dl dd h3{ font-size: 1.33rem; margin-bottom: 2.5%;}
}



/*result*/
.result .result_box{ margin: 60px auto;}
.result .result_box h3{ text-align: center; padding: 0.25em; margin-bottom: 40px; font-size: 2rem; color: #cf7daa; border-top: 4px solid #cf7daa; border-bottom: 4px solid #cf7daa;}
.result .result_box dl{ display: flex; align-items: center; justify-content: center; margin: 0 auto;}
.result .result_box dl dt{ width: 420px;}
.result .result_box dl dt figure{ position: relative; z-index: 1;}
.result .result_box dl dt figure:after{ content: ""; width: 100%; height: 100%; background: #cf7daa; position: absolute; left: 0; top: 0; z-index: -1; transform: rotate(5deg);}
.result .result_box dl dd{ margin: 0 0 0 40px;}
.result .result_box dl dd ul li{ padding: 0.5em 0.5em 0.5em 2em; display: flex; align-items: center; justify-content: space-between; border-bottom: 2px dotted #cf7daa; position: relative;}
.result .result_box dl dd ul li:first-child{ border-top: 2px dotted #cf7daa;}
.result .result_box dl dd ul li i{ color: #cf7daa; position: absolute; left: 0.5em; top: 50%; transform: translateY(-50%);}
.result .result_box dl dd ul li strong{ color: #cf7daa;}
.result .result_box dl dd ul li span{ background: #cf7daa; color: #fff; font-weight: bold; padding: 0.25em 0.75em; margin-left: 2em;}
@media screen and (max-width:767px){
.result .result_box{ margin: 10% auto;}
.result .result_box h3{ margin-bottom: 7.5%; font-size: 1.75rem;}
.result .result_box dl{ display: block;}
.result .result_box dl dt{ width: 100%;}
.result .result_box dl dt figure{ width: 66.66%; margin: auto;}
.result .result_box dl dd{ width: 100%; margin: 7.5% auto 0;}
.result .result_box dl dd ul{ width: 100%;}
.result .result_box dl dd ul li span{ background: #cf7daa; color: #fff; font-weight: bold; padding: 0.25em 0.75em; margin-left: 2em;}
}

.result .result_box.even dl{ flex-direction: row-reverse;}
.result .result_box.even dl dd{ margin: 0 40px 0 0;}
@media screen and (max-width:767px){
.result .result_box.even dl dd{ margin: 7.5% auto 0;}
}



/*point*/
.point #point_list dl{ display: flex; align-items: center; justify-content:space-between; margin: 40px auto;}
.point #point_list dl:nth-child(2n+1){ flex-direction: row-reverse;}
.point #point_list dl dt{ width: 720px;}
.point #point_list dl dd{ width: 240px;}
.point #point_list dl dt h3{ border: 2px solid #cf7daa; border-left-width: 0.25em; font-size: 1.5rem; color: #cf7daa; padding: 0.25em 0.25em 0.25em 0.5em; margin-bottom: 20px;}
@media screen and (max-width:767px){
.point #point_list dl{ display: block; margin: 7.5% auto;}
.point #point_list dl dt{ width: 100%; margin-bottom: 5%;}
.point #point_list dl dd{ width: 100%;}
.point #point_list dl dt h3{ font-size: 1.25rem; margin-bottom: 3.75%;}
.point #point_list dl dd img{ width: 50%;}
}

.point p.comment{ background: #cf7daa; color: #fff; text-align: center; padding: 0.5em; margin-top: 80px;}
@media screen and (max-width:767px){
.point p.comment{ margin-top: 15%;}
}



/*price*/
.price #price_list{ margin: 40px auto;}
.price #price_list ul li{ margin: 20px auto; font-size: 1.5rem; background: #cf7daa; color: #fff; padding: 0.5em 0.5em 0.5em 2em; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 1;}
.price #price_list ul li:before{ content: ""; width: 100%; height: 50%; background: rgba(255,255,255,0.1); position: absolute; left: 0; right: 0; top: 0; z-index: -1;}
.price #price_list ul li i{ color: #fff; position: absolute; left: 0.5em; top: 50%; transform: translateY(-50%); z-index: 5;}
.price #price_list ul li strong{ color: #fff;}
.price #price_list ul li span{ background: #fff; color: #cf7daa; font-weight: bold; padding: 0.25em 0.75em; margin-left: 2em;}
@media screen and (max-width:767px){
.price #price_list{ margin: 7.5% auto;}
.price #price_list ul li{ margin: 5% auto; font-size: 1.25rem; display: block; padding: 0.125em 0.5em 0.5em; text-align: center;}
.price #price_list ul li:before{ height: 40%;}
.price #price_list ul li i{ position: static; line-height: 1em; transform: none; margin: 0 auto;}
.price #price_list ul li strong{ display: block; margin-bottom: 2.5%;}
.price #price_list ul li span{ display: block; margin: 0; padding: 0.125em;}
}

.price .att{ margin-top: 40px;}
.price .att ul li{ padding: 0.25em 0.25em 0.25em 1.5em; border-bottom: 1px dotted #3c281e; font-size: 0.8rem; position: relative;}
.price .att ul li:first-child{ border-top: 1px dotted #3c281e;}
.price .att ul li:before{ content: "＊"; position: absolute; left: 0.25em; top: 0.25em;}
@media screen and (max-width:767px){
.price .att{ margin-top: 7.5%;}
.price .att ul li{ font-size: 0.7rem;}
}






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