@charset "UTF-8"; @media screen and (min-width: 768px),print {

main {
max-width: 1920px;
width: 100%;
margin-inline: auto;
}

.f-yu-gothic { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-weight: 500; }

/* 
.main-title {
font-weight: 500;
font-size: 28px;
letter-spacing: 0.1em;
text-align: center;
color: #0d0d0d;
background: #F9F9F9;
padding: 34px 0 30px;
} */

#con1 {}
#con1 .bx{}
#con1 .bx .ttl{width: 100%; margin: 0 auto;}
#con1 .bx .ttl img{width: 100%; margin: 0 auto;}
#con1 .bx .inner{background: #202020; padding: 109px 0 116px;}
#con1 .bx .inner .ttl1{font-size: 26px; font-weight: 600; color: #fff; letter-spacing: 2px; text-align: center; margin-bottom: 30px;}
#con1 .bx .inner .txt{font-size: 16px; color: #fff; letter-spacing: 0.7px; text-align: center; line-height: 2;}
#con1 .bx{}

#con1 .bx .con1-bigimg {width: 100%; margin: 0 auto 180px;}
#con1 .bx .loop {
width: 100%;
height: 360px; /*画像の高さ等*/
background: url(../images/nagoyastudio/con1-bigimg.png) repeat-x;
background-position: center;
animation: bgloop 30s linear infinite; /*秒数等はお好きな数値に、infiniteは残す*/
}

@keyframes bgloop {
from { background-position: 0 0; }
to { background-position: -2130px 0; /*-1000px部分は画像の横幅と同じ数値*/ }
}


#con2 {}
#con2 .bx{width: 100%; max-width: 1920px; margin: 0 auto 206px;}
#con2 .bx .inner{width: 100%; max-width: 1920px;  margin: 0 auto;}

#con2 .bx .inner .in-bx1{width: 1280px; margin: 0 auto 200px; position: relative; }
#con2 .bx .inner .in-bx1 .in-inner{width: 523px; margin-left: auto; margin-right: 91px; padding-top: 110px;}
#con2 .bx .inner .in-bx1 .in-inner .icon{position: absolute; right: 530px; top: 75px;}
#con2 .bx .inner .in-bx1 .in-inner .ttl{font-size: 26px; font-weight: 500; letter-spacing: 2px; margin-bottom: 58px; line-height: 1.4; padding-left: 125px;}
#con2 .bx .inner .in-bx1 .in-inner .img{position: absolute; left: 0; top: 0;}
#con2 .bx .inner .in-bx1 .in-inner .txt{font-size: 16px; letter-spacing: 0.6px; margin-bottom: 32px; line-height: 2;}

#con2 .bx .inner .in-bx2{position: relative; margin-bottom: 278px;}
#con2 .bx .inner .in-bx2 .in-inner{width: 567px; margin-right: auto; margin-left: 404px; padding-top: 194px;}
#con2 .bx .inner .in-bx2 .in-inner .icon{position: absolute; left: 348px; top: 142px;}
#con2 .bx .inner .in-bx2 .in-inner .ttl{font-size: 26px; font-weight: 500; letter-spacing: 2px; margin-bottom: 40px; line-height: 1.4; padding-left: 125px;}
#con2 .bx .inner .in-bx2 .in-inner .txt{font-size: 16px; letter-spacing: 0.6px; margin-bottom: 32px; line-height: 2;}
#con2 .bx .inner .in-bx2 .img{ width: 44.5%; position: absolute;  left: 56%; top: 11.5%;}
#con2 .bx .inner .in-bx2 .img img{width: 100%;}

#con2 .bx .inner .in-bx3{width: 1280px; margin: 0 auto 310px; position: relative; }
#con2 .bx .inner .in-bx3 .in-inner{width: 523px; margin-left: auto; margin-right: 91px; padding-top: 110px;}
#con2 .bx .inner .in-bx3 .in-inner .icon{position: absolute; right: 530px; top: 75px;}
#con2 .bx .inner .in-bx3 .in-inner .ttl{font-size: 26px; font-weight: 500; letter-spacing: 2px; margin-bottom: 12px; line-height: 1.4; padding-left: 125px;}
#con2 .bx .inner .in-bx3 .in-inner .ttl-sub{text-align: right; margin-bottom: 28px; padding-right: 88px;}
#con2 .bx .inner .in-bx3 .in-inner .img{position: absolute; left: 0; top: -10px;}
#con2 .bx .inner .in-bx3 .in-inner .txt{font-size: 16px; letter-spacing: 0.6px; margin-bottom: 32px; line-height: 2;}

#con2 .bx .inner .in-bx4{width: 1280px; margin: 0 auto 200px; position: relative; }
#con2 .bx .inner .in-bx4 .in-inner{width: 567px; margin-right: auto; margin-left: 91px; padding-top: 110px;}
#con2 .bx .inner .in-bx4 .in-inner .icon{position: absolute; left: 35px; top: 58px;}
#con2 .bx .inner .in-bx4 .in-inner .ttl{font-size: 26px; font-weight: 500; letter-spacing: 2px; margin-bottom: 41px; line-height: 1.4; padding-left: 125px;}
#con2 .bx .inner .in-bx4 .in-inner .img{position: absolute; right: -140px; top: -4px;}
#con2 .bx .inner .in-bx4 .in-inner .txt{font-size: 16px; letter-spacing: 0.6px; margin-bottom: 32px; line-height: 2;}


#con3 {}
#con3 .bx{width: 100%; max-width: 1920px; margin: 0 auto 135px; background: #FBC600; padding: 43px 0 41px;}
#con3 .bx .inner{width: 1100px; margin: 0 auto; }
#con3 .bx .inner .ttl{font-size: 77px; letter-spacing: 3px; line-height: 1.2; color: #fff; font-weight: 100; text-align: center; margin-bottom: -7px;}
#con3 .bx .inner .ttl1{font-size: 40px; font-weight: bold; letter-spacing: 3.3px; text-align: center; margin-bottom: 12px;}
#con3 .bx .inner .txt{font-size: 16px; letter-spacing: 0.6px; text-align: center; margin-bottom: 26px; line-height: 2;}
#con3 .bx .inner .img{text-align: center;}
#con3 .bx .inner .list{background: #fff; padding: 40px 0 44px 113px; margin-bottom: 44px; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;-webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
#con3 .bx .inner .list li{font-size: 20px; letter-spacing: 1.5px; position: relative; margin-right: 64px;}
#con3 .bx .inner .list li:last-child{margin-right: 0;}
#con3 .bx .inner .list li::before{content: ""; width: 17px; height: 17px; margin: 0 auto; background: url(../images/nagoyastudio/con3-icon.svg) no-repeat; position: absolute; left: -26px; top: 10px;}
#con3 .bx .inner .btn{text-align: center; padding-left: 10px;}


#access {}
#access .bx{width: 1100px; margin: 0 auto; position: relative;}
#access .bx .ttl{font-size: 73px; letter-spacing: 3px; line-height: 1.2; color: #E6E6E6; font-weight: 100; text-align: center; margin-bottom: 0;}
#access .bx .ttl1{font-size: 26px; font-weight: bold; letter-spacing: 2.3px; text-align: center; margin-bottom: 6px;}
#access .bx .txt{font-size: 16px; letter-spacing: 0.6px; text-align: center; margin-bottom: 26px; line-height: 2;}
#access .bx .huki{position: absolute; right: -15px; top: 100px;}
#access .bx .map{width: 1100px; height: 420px; margin: 0 auto 89px;}
#access .bx .map iframe{width: 1100px; height: 420px; margin: 0 auto;}
#access .bx .txt1{width: 500px; margin: 0 auto 56px; font-size: 20px; letter-spacing: 1.5px; text-align: center; line-height: 1.35; position: relative;}
#access .bx .txt1::before{content: ""; width: 26px; height: 48px; margin: 0 auto; background: url(../images/nagoyastudio/access-icon1.svg) no-repeat; position: absolute; left: 1px; top: 6px;}
#access .bx .txt1::after{content: ""; width: 26px; height: 48px; margin: 0 auto; background: url(../images/nagoyastudio/access-icon2.svg) no-repeat; position: absolute; right: 4px; top: 6px;}



/*  */

#form .form-Box-inner h2 {
font-size: 26px;
font-weight: bold;
text-align: center;
position: relative;
padding-bottom: 18px;
margin-bottom: 58px;
letter-spacing: 0.08em;
}

#form .form-Box-inner h2:after {
content: "";
background-color: #000;
width: 60px;
height: 2px;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
}

#form #cv-area-last {
background-image: url("../images/suzukamodel/bg04.png");
background-repeat: repeat-x;
background-position: top center;
height: 539px;
margin-bottom: -285px;
}

#form #cv-area-last .frame {
width: 1200px;
height: 255px;
margin: 0 auto;
position: relative;
padding-top: 59px;
}

#form #cv-area-last .frame h2 {
font-size: 26px;
letter-spacing: 0.08em;
text-align: center;
color: #fff;
margin-bottom: 23px;
}

#form #cv-area-last .frame .tel-box {
}

#form #cv-area-last .frame .tel-box .tel-number {
font-size: 50px;
font-weight: bold;
line-height: 50px;
letter-spacing: 0.05em;
text-align: center;
color: #fff;
margin-bottom: 11px;
}

#form #cv-area-last .frame .tel-box .tel-time {
font-size: 16px;
letter-spacing: 0.05em;
color: #fff;
text-align: center;
}

#form #cv-area-last .frame .human {
position: absolute;
bottom: 0;
left: 191px;
}

#nagoyastudio main #form {
padding-top: 0; padding-bottom: 50px;
background: #F2F2F2; 

}

#nagoyastudio main #form .form-Box-inner {
width: 1200px !important;
margin: 0 auto;
padding: 68px 100px;
border-radius: 30px;
}

}

@media screen and (max-width: 767px) {
.f-yu-gothic { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-weight: 500; }


#con1 {}
#con1 .bx{}
#con1 .bx .ttl{width: 100%; margin: 0 auto;}
#con1 .bx .ttl img{width: 100%; margin: 0 auto;}
#con1 .bx .inner{background: #202020; padding: 16vw 0 16vw;}
#con1 .bx .inner .ttl1{font-size: 5.2vw; font-weight: 600; color: #fff; letter-spacing: 0.5vw; text-align: center; margin-bottom: 5vw; line-height: 1.9;}
#con1 .bx .inner .txt{font-size: 3.6vw; color: #fff; letter-spacing: 0.4vw; padding: 0 6vw; line-height: 2.1;}
#con1 .bx{}

#con1 .bx .con1-bigimg {width: 100%; margin: 0 auto 5vw;}
#con1 .bx .loop {
width: 100%;
height: 41vw; /*画像の高さ等*/
background: url(../images/nagoyastudio/sp-con1-bigimg.png) repeat-x;
background-position: center; background-size: cover;
animation: bgloop 30s linear infinite; /*秒数等はお好きな数値に、infiniteは残す*/
}

@keyframes bgloop {
from { background-position: 0 0; }
to { background-position: -200vw 0; /*-1000px部分は画像の横幅と同じ数値*/ }
}


#con2 {}
#con2 .bx{width: 100%; margin: 0 auto 20vw;}
#con2 .bx .inner{width: 100%; margin: 0 auto;}

#con2 .bx .inner .in-bx1{width: 100%; margin: 0 auto 5vw; position: relative; }
#con2 .bx .inner .in-bx1 .in-inner{width: 100%; margin: 0 auto 5vw; padding-top: 17vw;}
#con2 .bx .inner .in-bx1 .in-inner .icon{width: 24%; margin: 0 auto 5vw;}
#con2 .bx .inner .in-bx1 .in-inner .ttl{font-size: 5.6vw; font-weight: 500; letter-spacing: 0.7vw; margin-bottom: 12vw; line-height: 1.58; text-align: center; padding-left: 1vw;}
#con2 .bx .inner .in-bx1 .in-inner .img{margin-bottom: 11vw;}
#con2 .bx .inner .in-bx1 .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.4vw; margin-bottom: 7.5vw; line-height: 2.15; padding: 0 8vw;}

#con2 .bx .inner .in-bx2{width: 100%; margin: 0 auto 5vw; position: relative; }
#con2 .bx .inner .in-bx2 .in-inner{width: 100%; margin: 0 auto 5vw; padding-top: 13vw;}
#con2 .bx .inner .in-bx2 .in-inner .icon{width: 24%; margin: 0 auto 5vw;}
#con2 .bx .inner .in-bx2 .in-inner .ttl{font-size: 5.6vw; font-weight: 500; letter-spacing: 0.7vw; margin-bottom: 12vw; line-height: 1.58; text-align: center; padding-left: 1vw;}
#con2 .bx .inner .in-bx2 .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.4vw; margin-bottom: 7.5vw; line-height: 2.15; padding: 0 8vw;}
#con2 .bx .inner .in-bx2 .img{margin-bottom: 11vw;}

#con2 .bx .inner .in-bx3{width: 100%; margin: 0 auto 5vw; position: relative; }
#con2 .bx .inner .in-bx3 .in-inner{width: 100%; margin: 0 auto 5vw; padding-top: 17vw;}
#con2 .bx .inner .in-bx3 .in-inner .icon{width: 24%; margin: 0 auto 5vw;}
#con2 .bx .inner .in-bx3 .in-inner .ttl{font-size: 5.6vw; font-weight: 500; letter-spacing: 0.7vw; margin-bottom: 4vw; line-height: 1.58; text-align: center; padding-left: 1vw;}
#con2 .bx .inner .in-bx3 .in-inner .ttl-sub{width: 75%; margin: 0 auto 12vw;}
#con2 .bx .inner .in-bx3 .in-inner .img{margin-bottom: 11vw;}
#con2 .bx .inner .in-bx3 .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.4vw; margin-bottom: 7.5vw; line-height: 2.15; padding: 0 8vw;}

#con2 .bx .inner .in-bx4{width: 100%; margin: 0 auto 5vw; position: relative; }
#con2 .bx .inner .in-bx4 .in-inner{width: 100%; margin: 0 auto 5vw; padding-top: 17vw;}
#con2 .bx .inner .in-bx4 .in-inner .icon{width: 24%; margin: 0 auto 5vw;}
#con2 .bx .inner .in-bx4 .in-inner .ttl{font-size: 5.6vw; font-weight: 500; letter-spacing: 0.7vw; margin-bottom: 21vw; line-height: 1.58; text-align: center; padding-left: 1vw;}
#con2 .bx .inner .in-bx4 .in-inner .img{margin-bottom: 11vw;}
#con2 .bx .inner .in-bx4 .in-inner .txt{font-size: 3.6vw; letter-spacing: 0.4vw; margin-bottom: 7.5vw; line-height: 2.15; padding: 0 8vw;}


#con3 {}
#con3 .bx{width: 100%; margin: 0 auto 15vw; background: #FBC600; padding: 13vw 0 11vw;}
#con3 .bx .inner{width: 92%; margin: 0 auto; }
#con3 .bx .inner .ttl{font-size: 11.5vw; letter-spacing: 0.95vw; line-height: 1.2; color: #fff; font-weight: 100; text-align: center; margin-bottom: 9vw; padding-left: 1vw;}
#con3 .bx .inner .ttl1{font-size: 6.9vw; font-weight: bold; letter-spacing: 1vw; text-align: center; margin-bottom: 9.5vw; line-height: 1.3; padding-left: 1vw;}
#con3 .bx .inner .txt{font-size: 3.6vw; letter-spacing: 0.42vw; margin-bottom: 8.5vw; line-height: 2.15; padding-left: 3.8vw;}
#con3 .bx .inner .img{text-align: center;}
#con3 .bx .inner .list{background: #fff; padding: 10vw 0 10vw 20vw; margin-bottom: 9vw; }
#con3 .bx .inner .list li{font-size: 4.8vw; letter-spacing: 0.4vw; position: relative; margin-bottom: 4vw;;}
#con3 .bx .inner .list li:last-child{margin-bottom: 0;}
#con3 .bx .inner .list li::before{content: ""; width: 20vw; height: 20vw; margin: 0 auto; background: url(../images/nagoyastudio/con3-icon.svg) no-repeat; position: absolute; left: -6.5vw; top: 2vw; background-size: 20%;}
#con3 .bx .inner .btn{width: 93%; margin: 0 auto;}


#access {}
#access .bx{width: 100%; margin: 0 auto; position: relative;}
#access .bx .ttl{font-size: 11.5vw; letter-spacing: 0.95vw; line-height: 1.2; color: #E6E6E6; font-weight: 100; text-align: center; margin-bottom: 4vw; padding-left: 1vw;}
#access .bx .ttl1{font-size: 6.2vw; font-weight: bold; letter-spacing: 0.8vw; text-align: center; margin-bottom: 2vw;}
#access .bx .txt{font-size: 3.7vw; letter-spacing: 0.4vw; margin-bottom: 7vw; line-height: 2.15; padding-left: 1.8vw; text-align: center;}
#access .bx .huki{width: 80%; margin: 0 auto 7vw;}
#access .bx .map{width: 100%; height: 113vw; margin: 0 auto 10vw;}
#access .bx .map iframe{width: 100%; height: 113vw; margin: 0 auto;}
#access .bx .txt1{width: 80%; margin: 0 auto 10vw; font-size: 4vw; letter-spacing: 0.2vw; text-align: center; line-height: 1.55; position: relative;}
#access .bx .txt1::before{content: ""; width: 10vw; height: 10vw; margin: 0 auto; background: url(../images/nagoyastudio/access-icon1.svg) no-repeat; position: absolute; left: -2vw; top: 3vw; background-size: 50%;}
#access .bx .txt1::after{content: ""; width: 10vw; height: 10vw; margin: 0 auto; background: url(../images/nagoyastudio/access-icon2.svg) no-repeat; position: absolute; right: -7vw; top: 3vw; background-size: 50%;}



/*  */

.form-Box {
padding: 0;
background-image: url("../images/modelhouse_yk/bg04.png");
background-repeat: repeat-x;
background-position: top center;
background-color: #F2F2F2;
padding-bottom: 25vw;
}

#form .form-Box-inner {
width: 92%;
margin: 0 auto;
padding-top: 17%;
}

#form .form-Box-inner h2 {
font-size: 6.2vw;
line-height: 8.5vw;
letter-spacing: 0.05em;
font-weight: bold;
text-align: center;
position: relative;
padding-bottom: 6%;
margin-bottom: 16%;
}

#form .form-Box-inner h2:after {
content: "";
background-color: #000;
width: 17%;
height: 0.483vw;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
}

#form #cv-area-last {
}

#form #cv-area-last .frame {
width: 100%;
margin: 0 auto;
position: relative;
padding-top: 17vw;
margin-top: 47.5vw;
}

#form #cv-area-last .frame h2 {
font-size: 4.348vw;
font-weight: bold;
line-height: 1.6666;
letter-spacing: 0.05em;
text-align: center;
margin-top: -48vw;
padding-bottom: 8vw;
margin-bottom: 3vw;
background-image: url("../images/modelhouse_yk/border02-sp.png");
background-repeat: no-repeat;
background-position: bottom center;
background-size: 69%;
}

#form #cv-area-last .frame .tel-box {
width: 84.6vw;
margin: 0 auto 14%;
border: 1px solid #434343;
border-radius: 3vw;
padding: 8vw 0;
position: relative;
}

#form #cv-area-last .frame .tel-box:after {
content: url("../images/modelhouse_yk/icon12-sp.png");
position: absolute;
top: 12vw;
right: 2vw;
transform: scale(0.5);
}

#form #cv-area-last .frame .tel-box .tel-number {
font-size: 7.6vw;
font-weight: bold;
line-height: 8vw;
letter-spacing: 0.242vw;
text-align: center;
color: #fff;
margin-bottom: 4%;
}

#form #cv-area-last .frame .tel-box .tel-time {
font-size: 3.8vw;
line-height: 3.8vw;
letter-spacing: 0.242vw;
text-align: center;
color: #9A9A9A;
}

#form #cv-area-last .frame .human {
width: 49%;
margin: 0 0 0 26.5vw;
}
}

@media screen and (min-width: 1920px) {
#cv-area .image-area {
height: 193.237vw;
}
}



@media screen and (min-width: 768px) and (max-width: 1319px) {
  /* この範囲だけに適用されるCSS */
#con2 .bx .inner .in-bx2 .in-inner{width: 567px; margin-right: auto; margin-left: 7%; padding-top: 194px;}
#con2 .bx .inner .in-bx2 .in-inner .icon{position: absolute; left: 3%; top: 142px;}
#con2 .bx .inner .in-bx2 .img{ width: 54.5%;  position: absolute;  left: 56.5%;  top: 11%;}
#con2 .bx .inner .in-bx2 .img img{width: 100%;}

}

@media screen and (min-width: 1320px) and (max-width: 1619px) {
  /* この範囲だけに適用されるCSS */
#con2 .bx .inner .in-bx2 .in-inner{width: 567px; margin-right: auto; margin-left: 10%; padding-top: 194px;}
#con2 .bx .inner .in-bx2 .in-inner .icon{position: absolute; left: 6%; top: 142px;}
#con2 .bx .inner .in-bx2 .img{ width: 54.5%;  position: absolute;  left: 56.5%;  top: 11%;}
#con2 .bx .inner .in-bx2 .img img{width: 100%;}

}


@media screen and (min-width: 1620px) and (max-width: 1919px) {
  /* この範囲だけに適用されるCSS */
#con2 .bx .inner .in-bx2 .in-inner{width: 567px; margin-right: auto; margin-left: 16%; padding-top: 194px;}
#con2 .bx .inner .in-bx2 .in-inner .icon{position: absolute; left: 12%; top: 142px;}
#con2 .bx .inner .in-bx2 .img{ width: 54.5%;  position: absolute;  left: 56.5%;  top: 11%;}
#con2 .bx .inner .in-bx2 .img img{width: 100%;}

}