@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Questrial&display=swap');


#int_contents,#module_titleArea {position:relative;width:auto;margin:0 auto;padding:0;}
#int_contents {padding:0;line-height:1.9;max-width:1414px;}
#int_contents img {width:100%;height:auto;}
#int_contents p {margin-bottom:30px;}

#int_contents {opacity:0;}

.int_text, .int_cp, .int_photo, .int_prof {margin-top:100px;}
.int_text, .int_cp, .int_photo, .int_prof, #int_footer {width:90%;}
.int_text, .int_photo, .int_prof, #int_footer {margin-left:auto;margin-right:auto;}

#int_title, .int_read, .int_cp, .int_text, .int_prof {font-family:'Noto Sans JP',sans-serif;}

#int_title {margin:20px 0 0 0;position:relative;}
#int_title .main, #int_title .sub {position:absolute;z-index:1000;}
#int_title .main, #int_title .sub , .gbox {width:100vw;}
#int_title .main span, #int_title .sub span {display:inline-block;}
#int_title .main span {max-width:40%;}
#int_title .sub span {max-width:35%;}

#int_title .main {font-size:290%;top:0;left:50%;background-color:#fff;padding-top:50px;padding-bottom:50px;padding-left:5%;font-weight:700;line-height:130%;}
#int_title .sub {top:6rem;left:58%;font-size:140%;background-color:rgba(255,255,255,0.7);padding-top:30px;padding-bottom:30px;padding-left:5%;font-weight:400;margin:0;}

#int_title .gbox {height:200px;position:absolute;top:0;left:50%;background:#e6e6e6;z-index:-1000;}
#int_title div.main_pic {width:86%;position:relative;overflow:hidden;}

#int_title #int {font-family:'Questrial',sans-serif;position:absolute;bottom:1em;left:-0em;display:inline-block;font-size:2.6rem;letter-spacing:1.4rem;color:#fff;padding:0;line-height:1em;padding:.3em 0;transform:rotate(90deg);transform-origin:bottom right;border-right:4rem solid #fff;box-sizing:content-box;}
#int_title #int:first-letter {font-size:3rem;}

.int_read p {width:55%;background:#fff;font-size:120%;font-weight:400;padding:2rem 4% 2rem 9%;}

.int_cp {font-weight:700;font-size:200%;background: url(../img/quote.png) no-repeat;background-size:3.5%;background-position:5% 10%;padding:2.4% 0 0 10%;margin-left:10%}

.int_text { font-size:110%; }
.int_q {margin-top:-60px;font-size:1.6em;font-weight:bold;}
.int_q, .int_a {margin-left:10%;}
.int_text .qs {background:url(../img/qs.png) no-repeat;background-size:contain;width:20px;height:140px;text-indent:-9999px;display:inline-block;overflow:hidden;;background-position:left bottom;}

.int_photo {position:relative;text-align:right;padding-bottom:50px;}
#int_contents .int_photo img {width:50%;}
.int_photo .gbox {height:75%;position:absolute;top:25%;left:0;background:#e6e6e6;z-index:-1000;}

.gbox {display:block;}

@media only screen and (max-width: 1080px){
#int_title .main, #int_title .sub {padding:30px;}
#int_title .main {left:40%;}
#int_title .sub {left:45%;}
#int_title .main span, #int_title .sub span {font-size:90%;padding-left:50px;}
#int_title .main span {max-width:60%!important;}
#int_title .sub span {max-width:55%!important;}
#int_title #int {letter-spacing:1.2rem;font-size:2rem;padding-bottom:1rem;border-right:3.5rem solid #fff;}
#int_title #int:first-letter {font-size:2.6rem;}

}

@media only screen and (max-width: 980px){
#int_contents {max-width:90%;}

#int_title {margin-top:0;}
#int_title .sub {padding:0;margin-bottom:40px;}
#int_title .main, #int_title .sub {position:static;width:90%;background:none;width:100%;padding:30px 0 0 0;}
#int_title .main span, #int_title .sub span {padding-left:0;width:100%;max-width:100%!important;}
#int_title .main {line-height:1.2em;}
#int_title div.main_pic {width:100%;}
#int_title #int {transform:none;right:0;left:auto;text-align:right;border-right:3.5rem solid #fff;}

#int_contents .int_photo img {width:70%;}
.int_cp,.int_text,.int_prof {width:100%;}
.int_cp, .int_text {margin-left:0;}
.int_text {padding:0;}
.int_q, .int_a {margin-left:3%;}
.int_cp {padding:5% 0 5% 3%;background-position: 3% 0;background-size:5%;}
.int_read p {width:100%;padding:0;}
#int_contents .int_photo img {width:100%;}
.int_prof {padding:2% 0;}

.gbox {display:none;}
}

@media only screen and (max-width: 767px){
.int_text, .int_photo {margin-top:40px;}
.int_text, .int_photo {margin-bottom:40px;}

.int_text, .int_photo {width:100%;}

.int_cp {padding-top:7%;background-size:7%;}
}

@media only screen and (max-width: 480px){
#int_title #int {font-size:1.5rem;border-right:2.5rem solid #fff;letter-spacing:.8rem;height:1.5rem;}
#int_title #int:first-letter {font-size:2rem;}
.int_cp {padding-top:10%;background-size:10%;}
}