@charset "utf-8";
/* CSS Document */

body { font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"; color: #333333; background-color: #FFF; font-feature-settings: "palt"; }
img { border:0; font-size: 0; line-height: 0; max-width: 100%; height: auto; flex-shrink: 0; }
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; border: 0; vertical-align: baseline; word-break: normal; word-wrap: break-word; line-height: 1; list-style: none; }
h1, h2, h3, h4, h5 { font-size: 1em; font-weight: normal; }
button, input, optgroup, select, textarea { margin: 0; padding: 0; color: inherit; font-family: inherit; font-size: inherit; line-height: inherit; }
* { -webkit-box-sizing: border-box; moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
a:link, a:hover, a:active, a:visited { color: inherit; text-decoration: none; transition: all 0.2s; border: none; outline: none; } a:hover { opacity: 0.5; }

@media screen and (min-width: 781px) {
body { font-size: 16px; }
.sp { display: none!important; }
a[href^="tel:"] { pointer-events: none; }
}
@media screen and (max-width: 780px) {
body { font-size: 14px; text-size-adjust: 100%; }
.pc { display: none!important; }
}

/* header
----------------------------------------------------------------------------------------------- */
header { position: fixed; top: 0; left: 0; width: 100%; display: flex; align-items: center; background: rgba(51,51,51,0.85); transition: 0.3s; z-index: 100; }
@media screen and (min-width: 781px) {
header.scroll, header.scroll nav div, header.scroll nav { height: 65px; }
header.scroll nav div { width: 15vw; }
header.scroll h1 img { transform: scale(0.8); }
header { height: 110px; }
header h1 { width: 14vw; max-width: 190px; margin: 0 auto 0 4.4vw; }
header nav { display: flex; height: 110px; }
header nav ul { display: flex; align-items: center; margin-right: 2.3vw; }
header nav ul li a { display: flex; align-items: center; }
header nav ul li a::before { content: ""; flex: none; width: 1px; height: 18px; margin: 0 2vw; opacity: 0.3; background: #FFF; }
header nav ul li:first-of-type a::before { display: none; }
header nav ul li a img { height: 1.8vw; max-height: 20px; }
header nav div { display: flex; justify-content: center; align-items: center; width: 21vw; max-width: 285px; height: 100%; padding: 0 2.2vw; background: #002d50; }
header #sp-menuBtn { display: none; }
}
@media screen and (max-width: 780px) {
header { height: 70px; display: flex; }
header h1 { margin-left: 5vw; }
header h1 img { height: 24px; }
header #sp-menuBtn { flex: none; width: 70px; height: 70px; margin-left: auto; background: url(../img/icon_menu.svg) no-repeat center center #002d50; z-index: 1000; opacity: 1!important; }
header nav { opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 1.2em; transition: all .5s; visibility: hidden; background-color: #002d50; z-index: 100; }
header nav a { display: block; margin: 3.5vh 0; }
header nav ul li a img { height: 7vw; max-height: 30px; }
header nav div img { height: 13vw; max-height: 60px; }
}
.open #sp-menuBtn { background: url("../img/icon_menu_close.svg") no-repeat center center #002d50; }
.open nav { transition: all .5s; visibility: visible; opacity: 1; }

/* footer
----------------------------------------------------------------------------------------------- */
footer { text-align: center; font-size: 0.8em; color: #4c6c84; letter-spacing: 0.05em; }
@media screen and (min-width: 781px) {
	footer { padding: 50px; }	
}
@media screen and (max-width: 780px) {
	footer { padding: 10vw; }	
}

/* mainvisual
----------------------------------------------------------------------------------------------- */
#mv { width: 100%; position: relative; background: url("../img/img_mv.jpg") no-repeat center; background-size: cover; z-index: -1; }
#mv::before { content: ""; width: 100%; display: block; position: absolute; bottom: 0; background: url("../img/img_bg_br-top.png") repeat-x; mix-blend-mode: darken; opacity: 0.8; }
@media screen and (min-width: 781px) {
#mv { height: 760px;} 
#mv::before { height: 40px; }
#mv img { width: 420px; height: 600px; position: absolute; top: 120px; right: 8vw; }
}
@media screen and (max-width: 780px) {
#mv { height: 400px; } 
#mv::before { height: 20px; background-size: contain; }
#mv img { width: 238px; height: 340px; position: absolute; bottom: 0; right: 0; }
}

/* main 共通スタイル
----------------------------------------------------------------------------------------------- */
#sc1, #sc2, #sc3, #sc4 { width: 100%; overflow: hidden; }
.lead .text h3 { display: flex; align-items: center; margin-left: -135px; }
.lead .text h3::before { content: ""; width: 110px; height: 2px; margin-right: 25px; background: #002d50; }
.lead .text p { padding-top: 2.5em; line-height: 2em; text-align: justify; }
h4.def-h { background: #002d50; display: flex; justify-content: center; align-items: center; }
@media screen and (min-width: 1361px) {
.lead .img { margin-right: 0; }
}
@media screen and (max-width: 1360px) and (min-width: 781px) {
.lead .img { margin-right: -9.926vw; }
}
@media screen and (min-width: 781px) {
.c-s { padding-left: 9.926vw!important; padding-right: 9.926vw!important; }
.lead { padding-top: 130px; display: flex; justify-content: space-between; align-items: center; }
.lead .text { width: 48%; }
.lead .img { max-width: 620px; margin-left: 7%; }
h4.def-h { height: 55px; margin-top: 80px; }
.def-iBox { margin-top: 60px; text-align: center; }
.def-box { margin-top: 60px; }
}
@media screen and (max-width: 780px) {
.c-s { padding-left: 8vw!important; padding-right: 8vw!important; }
.h2-h { height: 5vw; max-height: 26px; }
.h3-h { height: 7vw; max-height: 48px; }
.h4-h { transform: scale(0.8); }
.lead { padding-top: 15vw; }
.lead .text h3 { margin-left: -10vw!important; }
.lead .text h3::before { width: 8vw!important; margin-right: 3vw!important; }
.lead .img { margin-top: 10vw; }
h4.def-h { margin-top: 15vw; padding: 15px; }
.def-iBox { margin-top: 10vw; text-align: center; }
.def-box { margin-top: 10vw; }
}
/* お問い合わせ バナー */
.contact-bnr .wrapper { display: flex; align-items: center; align-content: center; justify-content: center; border: solid 10px #eeeee1; background: #e6e6d0; margin: 0 auto; }
@media screen and (min-width: 781px) {
.contact-bnr { margin-top: 130px; }
.contact-bnr .wrapper { max-width: 1090px; max-height: 240px; width: 80.14vw; height: 17.64vw; flex-wrap: wrap; }
.contact-bnr .wrapper div { max-width: 740px; width: 54.41vw; margin: 5px 0 15px 0; }
.contact-bnr .wrapper a:first-of-type { max-width: 434px; width: 31.91vw; margin-right: 20px; }
.contact-bnr .wrapper a:last-of-type { max-width: 239px; width: 17.57vw; }
}
@media screen and (max-width: 780px) {
.contact-bnr { margin-top: 13vw; padding: 0 4vw!important; }
.contact-bnr .wrapper { max-width: 370px; max-height: 300px; width: 92vw; height: 74.66vw; flex-direction: column; padding: 30px; }
.contact-bnr .wrapper * { width: 100%; }
.contact-bnr .wrapper a:first-of-type { margin: 10px 0;}
}

/* main
----------------------------------------------------------------------------------------------- */
/* service menu */
#service { background: url("../img/img_bg_br.jpg"); }
#service h2 { text-align: center; }
#service ul { display: flex; justify-content: center; }
#service ul li { margin: 2px 1px 0 1px; background: #FFF; font-size: 0; }  
@media screen and (min-width: 781px) {
#service { padding: 65px 0 80px 0; }
#service h2 { padding: 0 0 35px 0; }
}
@media screen and (max-width: 780px) {
#service { padding: 10vw 4vw 4vw 4vw!important; }
#service h2 { padding: 0 0 6vw 0; }
#service ul { flex-wrap: wrap; }
#service ul li { width: calc(100% / 2 - 2px); max-width: 271px; }
#service ul li img { width: 100%; }
}
/* sc1 */
#sc1 { background: url("../img/img_bg_hw.jpg") repeat-x; }
#sc1 .bnr { text-align: right; }
#sc1 section:nth-of-type(3) { background-image: url("../img/img_sc1_bg-1.jpg"), url("../img/img_sc1_bg-2.jpg"); background-repeat: no-repeat, no-repeat; background-position: bottom left, bottom right; }
#sc1 section:nth-of-type(3) p { line-height: 2em; text-align: justify; }
@media screen and (min-width: 781px) {
#sc1 .bnr img { width: 300px; margin-top: 20px; }
#sc1 section:nth-of-type(3) p { width: 44.85vw; margin: 0 auto; padding-top: 2.5em; }
}
@media screen and (max-width: 780px) {
#sc1 .bnr { max-width: 300px; margin: 8vw auto 0 auto; }
#sc1 section:nth-of-type(3) { background-position: top 12vw left, bottom right!important; background-size: 264px auto, 304px auto }
#sc1 section:nth-of-type(3) .def-iBox img { width: 70vw; }
#sc1 section:nth-of-type(3) p { padding-top: 7.5vw; }
}
/* sc2 */
#sc2 ul.merit li h5 { text-align: center; }
#sc2 ul.merit li h5 img { padding-bottom: 10px; border-bottom: solid 2px #b6ac8f; }
#sc2 .def-box, #sc2 .def-box p { line-height: 1.8em; text-align: justify; }
#sc2 .price { border: solid 10px #e5eaed; color: #002d50; }
#sc2 .price div:last-of-type ul li::before { content: ""; display: inline-block; vertical-align: middle; width: 7px; height: 7px; margin-right: 0.5em; border-radius: 10px; background: #002d50; }
#sc2 .price div:last-of-type ul li { margin-left: 0.3em; padding-bottom: 0.5em; }
#sc2 .price div:last-of-type ul li:last-of-type { padding-bottom: 1em; }
@media screen and (min-width: 781px) {
#sc2 ul.merit { display: flex; justify-content: space-between; }
#sc2 ul.merit li { width: 50%; padding: 0 4vw; }
#sc2 ul.merit li:first-of-type { padding: 0 3.5vw 0 5vw; }
#sc2 ul.merit li:last-of-type { padding: 0 5vw 0 3.5vw; }
#sc2 ul.merit li h5 { padding-bottom: 30px; }
#sc2 .price { display: flex; justify-content: space-between; padding: 4.3vw 6vw; }
#sc2 .price div:first-of-type { width: 55%; padding-right: 5.5vw; }
#sc2 .price div:first-of-type img { margin: 10px 0 20px 0; }
#sc2 .price div:last-of-type { width: 45%; padding-left: 2vw; border-left: solid 1px #b2c0ca; }
#sc2 .price div:last-of-type h5 { padding-bottom: 1.25em; font-size: 1.1em; font-weight: bold; }
}
@media screen and (max-width: 780px) {
#sc2 ul.merit li h5 { padding-bottom: 3vw; }
#sc2 ul.merit li h5 img { transform: scale(0.8); }
#sc2 ul.merit li:first-of-type { margin-bottom: 8vw; }
#sc2 .price { padding: 4vw; }
#sc2 .price div:first-of-type p { padding: 1.5em 0; }
#sc2 .price div:last-of-type h5 { padding-bottom: 1.25em; font-size: 1.1em; font-weight: bold; }
}
/* sc3 */
#sc3 h5 { padding-bottom: 2em; text-align: center; font-weight: bold; color: #6d5920; }
#sc3 h5 + p { line-height: 2em; text-align: justify; }
#sc3 .point h5 { padding-bottom: 1em; text-align: left; }
#sc3 ul li::before { content: ""; display: inline-block; vertical-align: middle; width: 7px; height: 7px; margin-right: 0.5em; border-radius: 10px; background: #333333; }
#sc3 ul li { margin-left: 0.3em; padding-bottom: 0.5em;padding-left: 1em; text-indent: -1em; line-height: 1.8em; }
#sc3 ul + p { padding-top: 0.6em; line-height: 1.8em; }
@media screen and (min-width: 781px) {
#sc3 .point h5 { font-size: 1.35em; }
}
@media screen and (max-width: 780px) {
#sc3 .point h5 { font-size: 1.2em; }
}
/* sc4 */
#sc4 h5 { text-align: center; }
#sc4 .voice ul li:nth-of-type(1), #sc4 .voice ul li:nth-of-type(2) { padding-bottom: 1.25em; }
#sc4 .voice ul li { padding-bottom: 0.5em; line-height: 1.8em; padding-left: 1em; text-indent: -1em; }
#sc4 .voice ul li::before { content: ""; display: inline-block; vertical-align: middle; width: 7px; height: 7px; margin-right: 0.5em; border-radius: 10px; background: #333333; }
#sc4 .voice ul li span { font-size: 1.1em; font-weight: bold; border-bottom: solid 3px #d3cdbc; }
#sc4 .price { border: solid 10px #e5eaed;}
#sc4 .price p { color: #002d50; line-height: 1.8em; }
@media screen and (min-width: 781px) {
#sc4 .voice ul { padding-top: 40px; }
#sc4 .voice ul li span { padding-bottom: 0.3em; line-height: 2em; }
#sc4 .price { display: flex; flex-direction: column; align-items: center; padding: 4.3vw 6vw; }
#sc4 .price img { width: 100%; max-width: 910px; }
#sc4 .price p { padding-top: 4vw; }
}
@media screen and (min-width: 1001px) {
#sc4 .voice { display: flex; padding-left: 10%; }
#sc4 .voice ul { display: flex; flex-wrap: wrap; }
#sc4 .voice ul li { width: 50%; }
}
@media screen and (max-width: 780px) {
#sc4 .voice { display: flex; justify-content: center; }
#sc4 .voice ul { padding-top: 6vw; }
#sc4 .voice ul li span { padding-bottom: 0.2em; line-height: 2em; }
#sc4 .answer .def-iBox { margin-top: 4vw; }
#sc4 .answer .def-iBox img { max-width: 400px; width: 100%; }
#sc4 .price { padding: 4vw; }
#sc4 .price p { padding-top: 4vw; }
}
/* info */
#info .wrapper { background: url("../img/img_bg_br.jpg"); }
#info::before { content: ""; display: block; width: 100%; background: url("../img/img_bg_br-top.png") repeat-x;  opacity: 0.9; }
#info h2 { text-align: center; }
#info h3 { text-align: center; background: rgba(255,255,255,0.15); display: flex; justify-content: center; align-items: center; }
#info p.t-c { color: #FFFFFF; line-height: 2em; }
#info ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
#info ul li { background: #FFF; color: #002d50; }
#info ul li h4 { display: flex; align-items: flex-end; margin-bottom: 1em; padding-bottom: 0.5em; font-size: 1.2em; font-weight: bold; line-height: 1.2em; border-bottom: solid 2px #8096a7; }
#info ul li h4 img { margin: 0 15px 3px 0; }
#info ul li p { line-height: 1.6em; }
#info .def-box { border: solid 2px rgba(255,255,255,0.20); }
#info .def-box p { padding-top: 1em; color: #FFF; line-height: 1.8em; }
@media screen and (min-width: 781px) {
#info { margin-top: 170px; }
#info .wrapper { padding: 65px 0 80px 0; }
#info::before { height: 40px; margin-top: -40px; }
#info h3 { height: 55px; margin-top: 65px; }
#info p.t-c { padding-top: 50px; text-align: center; }
#info ul li { width: calc( 50% - 25px); margin-top: 50px; padding: 2.5vw 3vw 3vw 3vw; }
#info ul li:last-of-type { width: 100%; }
#info .def-box { padding: 3vw; }
}
@media screen and (max-width: 780px) {
#info { margin-top: 15vw; }
#info .wrapper { padding: 10vw 0vw!important; }
#info::before { height: 20px; background-size: contain; margin-top: -20px; }
#info h3 { margin-top: 10vw; padding: 15px; }
#info p.t-c { padding-top: 6vw; }
#info ul li { width: 100%; margin-top: 6vw; padding: 6vw; }
#info .def-box { padding: 6vw; }
}
/* company */
#company h2 { text-align: center; }
#company a { text-decoration: underline; }
#company div dl { border-bottom: solid 1px rgba(0,45,80,0.2); }
#company div dl dt { font-weight: bold; color: #002d50; }
#company .map + p { padding-top: 1em; line-height: 1.5em; }
@media screen and (min-width: 1001px) {
#company div { display: flex; justify-content: space-between; align-items: flex-start; }
#company div .img { width: 48%; }
#company div .img { flex-direction: column; align-items: center; }
#company div dl { width: 48%; }
}
@media screen and (max-width: 1000px) and (min-width: 781px) {
#company div .img img { width: 50%; flex: none; }
#company div dl { margin-top: 8vw; }
}
@media screen and (min-width: 781px) {
#company { padding-top: 130px; }
#company h2 { padding-bottom: 65px; }
#company div .img { display: flex; justify-content: flex-start; align-items: center; }
#company div dl dt, #company div dl dd { padding: 1.5em 1em; border-top: solid 1px rgba(0,45,80,0.2); line-height: 1.5em; }
#company div dl { display: flex; flex-wrap: wrap; }
#company div dl dt { width: 25%; }
#company div dl dd { width: 75%; }
}
@media screen and (max-width: 780px) {
#company { padding-top: 15vw; }
#company h2 { padding-bottom: 10vw; }
#company div dl { margin-top: 10vw; }
#company div dl dt { padding: 1em 1em 0.5em 1em; line-height: 1.5em; border-top: solid 1px rgba(0,45,80,0.2); }
#company div dl dd { padding: 0 1em 1em 1em; line-height: 1.5em; }
#company .map iframe { height: 300px!important; }
}
/* 彫刻教室 */
@media screen and (min-width: 781px) {
.school { margin-top: 130px; text-align: center; }
}
@media screen and (max-width: 780px) {
.school { margin-top: 15vw; text-align: center; }
}
/* お問い合わせ 最下部 */
#contact { display: flex; flex-direction: column; align-items: center; }
#contact .wrapper { display: flex; align-items: center; align-content: center; justify-content: center; margin: 0 auto; border-top: solid 2px #002d50; border-bottom: solid 2px #002d50; }
#contact h2 { text-align: center; }
#contact .wrapper p { padding: 0.75em 0.5em; background: #e6e6d0; text-align: center; color: #002d50; }
@media screen and (min-width: 781px) {
#contact { margin-top: 130px; }
#contact h2 { padding-bottom: 50px; }
#contact .wrapper { max-width: 1090px; max-height: 355px; width: 100%; height: 35vw; flex-wrap: wrap; }
#contact .wrapper div { max-width: calc(64.41vw + 40px); margin: 5px 0 15px 0; }
#contact .wrapper a img { width: 100%; max-width: 200%; }
#contact .wrapper a:first-of-type { max-width: 590px; width: 43.38vw; margin-right: 40px; }
#contact .wrapper a:last-of-type { max-width: 290px; width: 21.23vw; }
#contact .wrapper p { width: calc(64.41vw + 40px); margin-top: 20px; letter-spacing: 0.1em; }
}
@media screen and (max-width: 780px) {
#contact { margin-top: 13vw; }
#contact h2 { padding-bottom: 6vw; }
#contact .wrapper { width: 100%; max-height: 370px; height: 80vw; flex-direction: column; padding: 30px; }
#contact .wrapper a:first-of-type { margin: 10px 0; }
#contact .wrapper p { max-width: 290px; width: 100%; margin-top: 10px; font-size: 0.9em; }
}
	
	
	
	
	