@charset "utf-8";
/*
Theme Name: マスターサロン経営塾
Description: マスターサロン経営塾のWPtheme
Theme URI: https://craftbeer-adventure.net
Author: https://craftbeer-adventure.net
Version: 1.0.1
License: Hair&Make maki
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-columns
*/

/* 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: Lucida Grande,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
font-size:18px;
font-size-adjust: none;
text-align:left;
color:#333;
}
@media screen and (max-width:1023px){
html,body{ font-size:3vw; min-width:240px; max-width:1023px; overflow-x: hidden;}
}
body{ padding-bottom: 0 !important;}

/*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;}

/*txt*/
p{ line-height:1.5em; 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;}

.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: all 0.3s ease;}
.opa:hover{ opacity: 0.7;}

/*footer*/
#footer{ background: #b67e60; color: #fff; padding: 20px; text-align: center;}
#footer *{ color: #fff;}
#footer ul{ letter-spacing: -1em;}
#footer ul li{ display: inline-block; letter-spacing: 0; vertical-align: middle;}
#footer ul li:first-child:after{ content: "|"; margin: 0 1em;}
#footer ul li a:hover{ text-decoration: underline;}
#footer p.copyright{ font-size: 14px; letter-spacing: 0.1em; margin-top: 20px; padding-top: 20px; border-top: 1px solid #fff;}
@media screen and (max-width:767px){
#footer{ padding:5%;}
#footer p.copyright{ font-size:2.5vw; margin-top:5%; padding-top:5%;}
}

/*メイン*/
#content{ overflow:hidden; position: relative;}
section{ width:100%; margin:60px auto 120px;}
.maincontent{ padding:0; margin:0 auto; width:1080px;}
@media screen and (max-width:767px){
section{ margin:7.5% auto 15%;}
.maincontent{ padding:0; margin:0 auto; width:95%;}
}

/*tit*/
h1,h2,h3,h4,h5,h6{ letter-spacing: 0.1em; line-height: 1.25em;}

.wrap{ width: 1024px; margin: 0 auto; color: #5d4439; line-height: 0}
@media screen and (max-width:1023px) {
.wrap{ width: 100%}
}

#modal_form{ z-index: 999;}

#thanks{ width: 100%; margin: 0 auto; text-align: center; line-height: 1.3; font-size: 20px; background: #fff0f4; overflow: hidden;}
@media screen and (max-width:767px) {
#thanks{ width: 100%; font-size: 3vw;}
}
#thanks input{ padding: 0.25em 1em; cursor: pointer;}

.fb_container{ position: relative; background-color: #FCF0F4;}
.fb_container img{ width: 750px; margin: 0 auto; display: block;}
.fb_container .fb-like{ position: absolute; bottom: 70px; left: 0; right: 0; margin: auto; text-align: center;}
.fb_like iframe{ height: 30px;}
.fb_iframe_widget iframe{ height: 30px !important; width:640px; max-width:640px;}
@media screen and (max-width: 767px) {
.fb_container img{ width: 100%;}
.fb_container .fb-like{ bottom:5vw; height:10vw; width:90vw; max-width:90vw; overflow: scroll;}
}

#thanks_head{ text-align: center;}
#thanks_head img{ margin: auto;}
#thanks #step2{ max-width: 940px;}
#thanks .step_box h2{ margin-bottom: 10px;}
@media screen and (max-width: 767px){
#thanks #step2{ width: 95%;}
#thanks .step_box h2{ font-size: 6.75vw; margin-bottom: 2.5%;}
}

#thanks section{ margin: 60px auto;}
#thanks .maincontent{ background: #fff; max-width: 940px; padding: 40px; border-radius: 20px;}
#thanks .maincontent p{ text-align: left;}
#thanks .maincontent h3{ background: #c83232; color: #fff; font-size: 32px; padding: 0.5em 0; margin: 80px auto 40px; border: 6px double #fff;}
@media screen and (max-width: 767px){
#thanks section{ margin: 10% auto;}
#thanks .maincontent{ padding: 5%; border-radius: 2.5vw;}
#thanks .maincontent p{ text-align: left;}
#thanks .maincontent h3{ font-size: 4.2vw; margin: 10% auto 5%;}
}

#thanks .confirm dl{ margin: 40px auto 0;}
#thanks .confirm dl dt{ background: #c83232; color: #fff; text-align: left; padding: 0.5em 1em; font-size: 24px; font-weight: bold; border-left: 6px double #fff;}
#thanks .confirm dl dd{ margin: 10px 10px 0; padding: 10px 0 10px 20px; border-left: 2px solid #c83232;}
#thanks .confirm dl dd p{ font-size: 18px;}
#thanks .confirm .cancel{ border: 1px solid #333; padding: 20px; margin-top: 20px;}
#thanks .confirm .cancel h5{ text-align: center; margin-bottom: 20px;}
#thanks .confirm .cancel h5 strong{ display: inline-block; background: #326496; color: #fff; padding: 0.5em 1.5em; border-radius: 2em;}
#thanks .confirm .cancel_in{ display: flex; align-items: center; justify-content: space-between;}
#thanks .confirm .cancel_in ol{ width: 42.5%; text-align: left;}
#thanks .confirm .cancel_in ol li{ padding-left: 1em; position: relative; padding: 0.5em 0.25em 0.5em 1.5em; border-top: 1px dotted #333; font-size: 18px; font-weight: bold;}
#thanks .confirm .cancel_in ol li span{ position: absolute; left: 0.25em; top: 0.5em;}
#thanks .confirm .cancel_in ol li:last-child{ text-align: right; font-size: 16px; font-weight: normal;}
#thanks .confirm .cancel_in figure{ width: 55%;}
@media screen and (max-width: 767px){
#thanks .confirm dl{ margin: 5% auto 0;}
#thanks .confirm dl dt{ font-size: 3.5vw;}
#thanks .confirm dl dd{ margin: 1.25% 1.25% 0; padding: 1.25% 0 1.25% 2.5%;}
#thanks .confirm dl dd p{ font-size: 3vw;}
#thanks .confirm .cancel{ padding: 5%; margin-top: 5%;}
#thanks .confirm .cancel h5{ margin-bottom: 5%;}
#thanks .confirm .cancel_in{ display: block;}
#thanks .confirm .cancel_in ol{ width: 100%;}
#thanks .confirm .cancel_in ol li{ font-size: 3vw;}
#thanks .confirm .cancel_in ol li:last-child{ font-size: 3vw;}
#thanks .confirm .cancel_in figure{ width: 100%;}
}



/*インタビュー映像*/
.interview_video{ margin: 36px 24px; padding: 8px; border: 8px double #fdd003; position: relative;}
.interview_video:before{ content: ""; width: 40px; height: 40px; border: 8px double #fdd003; position: absolute; left: -28px; top: -28px; z-index: 3;}
.interview_video:after{ content: ""; width: 40px; height: 40px; border: 8px double #fdd003; position: absolute; right: -28px; bottom: -28px; z-index: 3;}
.youtube{ position:relative; width:100%; padding-top:56.25% !important; margin: auto;}
.youtube iframe{ position: absolute; top:0; right:0; width:100% !important; height:100% !important; vertical-align: bottom; border: 2px solid #000;}
@media screen and (max-width:767px){
.interview_video{ margin: 3.75vw 2.5vw; padding: 1.25vw; border: 1.25vw double #fdd003;}
.interview_video:before{ width: 5vw; height: 5vw; border: 1.25vw double #fdd003; left: -3.125vw; top: -3.125vw;}
.interview_video:after{ width: 5vw; height: 5vw; border: 1.25vw double #fdd003; right: -3.125vw; bottom: -3.125vw;}
}



.pc-only { display: block}
@media screen and (max-width:1023px) {
.pc-only { display: none}
}
.mobile-only { display: none}
@media screen and (max-width:1023px) {
.mobile-only { display: block}
}