@charset "UTF-8";
@media screen and (min-width: 768px),print {
#concept-in .con-box1 { background: url(../images/concept/bg01.jpg) top center no-repeat; min-height: 540px;}
#concept-in .con-box1 p { width: 1100px; margin: 0 auto; text-align: right; padding: 34px 22px 0 0;}

#concept-in .con-box2 { background: url(../images/concept/bg02.jpg) 50% 0 no-repeat; min-height: 1100px; padding: 170px 0 0 0;}
#concept-in .con-box2-in { width: 1100px; margin: 0 auto; padding-left: 10px;}
#concept-in .con-box2-in h4 { margin: 0 0 55px 0;}
#concept-in .con-box2-in .tl { font-size: 24px; font-weight: bold; line-height: 1.6; margin: 0 0 55px 0;}
#concept-in .con-box2-in .txt { color: #707070; font-size: 16px; margin-bottom: 2em;}
#concept-in .con-box2-in .logo { margin: 55px 0 0 0;}

#concept-in .tl-set .num-tl { font-size: 18px; font-weight: bold; line-height: 1; margin-bottom: 50px;}
#concept-in .tl-set .num-tl .num { border-bottom: 1px solid #000;font-family: 'Oswald', sans-serif; font-size: 24px; margin-right: 1em;}
#concept-in .tl-set .num-tl .active { background: #fed900; padding: 8px 4px;}
#concept-in .tl-set h4.tl { font-weight: bold; margin-bottom: 80px;}
#concept-in .tl-set h4.tl .jp { display: block; margin-bottom: 30px; font-size: 48px; line-height: 1.6;}
#concept-in .tl-set h4.tl .en { display: block; color: #ffd900; font-family: 'Oswald', sans-serif; font-size: 90px; line-height: 1;text-transform: uppercase;}

#concept-in .con-box3 { width: 1100px; margin: 0 auto 200px;}
#concept-in .con-box3 .tl-set { background: url(../images/concept/img01.jpg) top right no-repeat; min-height: 520px; padding: 140px 0 0 0;}
#concept-in .con-box3 .txt1 { font-size: 18px; font-weight: bold; margin: 0 0 80px 100px; line-height: 2.2; }
#concept-in .con-box3 .txt2 { font-size: 18px; font-weight: bold; padding: 50px 0 0 500px; line-height: 2.2; background: url(../images/concept/img02.jpg) top left no-repeat; min-height: 340px}

#concept-in .con-box4 { width: 1100px; margin: 0 auto 200px;}
#concept-in .con-box4 .tl-set { background: url(../images/concept/img03.jpg) top left no-repeat; min-height: 520px; padding: 210px 0 0 540px;}
#concept-in .con-box4 .txt-set { background: url(../images/concept/img04.jpg) top right no-repeat; min-height: 290px; padding: 55px 0 0 0; margin: 0 100px;}
#concept-in .con-box4 .txt-set .txt { font-size: 18px; font-weight: bold; margin: 0 0 40px; line-height: 2.2; }

#concept-in .con-box5 { background: url(../images/concept/img05.jpg) top center no-repeat; padding: 570px 0 0 0;}
#concept-in .con-box5-in { width: 1100px; margin: 0 auto 200px;}
#concept-in .con-box5 .tl-set { background: url(../images/concept/img06.jpg) top right no-repeat; min-height: 520px; padding: 140px 0 0 0;}
#concept-in .con-box5 .txt1 { background: url(../images/concept/img07.jpg) top right no-repeat; min-height: 290px; padding: 20px 0 0 100px; margin: 0 100px 100px 0;}
#concept-in .con-box5 .txt2 { background: url(../images/concept/img08.jpg) top left no-repeat; min-height: 290px; padding: 20px 0 0 490px; }
#concept-in .con-box5 .txt1 p,
#concept-in .con-box5 .txt2 p { font-size: 18px; font-weight: bold; margin: 0 0 1em; line-height: 2.2; }

#concept-in .con-box6 { width: 1100px; margin: 0 auto 100px; text-align: center;}
#concept-in .con-box6 .tl { font-size: 24px; font-weight: bold; margin-bottom: 50px;}
#concept-in .con-box6 .tl span { display: block; background: url(../images/concept/bg03.jpg) bottom center no-repeat;}

.link_releated { width: 1040px; margin: 0 auto; background: #000; transform:skewX(-10deg); padding: 30px 80px;}
.link_releated .tl { color: #fff; transform:skewX(10deg);font-family: 'Oswald', sans-serif; font-size: 14px; position: relative; line-height: 1; margin-bottom: 20px;}
.link_releated .tl::after {  content: ''; height: 1px; width: 760px; background: #fff; display: block; position: absolute; top: 6px; right: 0;}
.link_releated ul {transform:skewX(10deg);}
}
@media screen and (max-width: 767px) {
#concept-in .con-box1 img { margin-bottom: 2em;}
#concept-in .con-box1 p { font-size: 2.6rem; font-weight: bold; text-align: center;padding-bottom: 2em; border-bottom: 1px solid #000;}

#concept-in .con-box2 { background: url(../sp-images/concept/bg02.jpg) top right no-repeat; background-size: 150%; padding-top: 10%;}
#concept-in .con-box2-in { width: 94%; margin: 0 auto 15%; }
#concept-in .con-box2-in h4 { margin: 0 0 8% 0;}
#concept-in .con-box2-in .tl { font-size: 1.8rem; font-weight: bold; line-height: 1.6; margin: 0 0 8% 0;}
#concept-in .con-box2-in .txt { color: #707070; margin-bottom: 1em;}
#concept-in .con-box2-in .logo { margin: 1em 0 0 0;}

#concept-in .tl-set .num-tl { font-size: 1.8rem; font-weight: bold; line-height: 1; margin-bottom: 5%; border-bottom: 1px solid #000; padding-bottom: 1em;}
#concept-in .tl-set .num-tl .num { font-family: 'Oswald', sans-serif; font-size: 3rem; margin-right: 0.5em;}
#concept-in .tl-set .num-tl .active { background: #fed900; padding: 8px 4px;}
#concept-in .tl-set h4.tl { font-weight: bold; margin-bottom: 10%;}
#concept-in .tl-set h4.tl .jp { display: block; margin-bottom: 5%; font-size: 3rem; line-height: 1.6;}
#concept-in .tl-set h4.tl .en { display: block; color: #ffd900; font-family: 'Oswald', sans-serif; font-size: 1.4rem; line-height: 1;text-transform: uppercase;}
#concept-in .tl-img { margin-bottom: 5%; text-align: center;}

#concept-in .con-box3 { width: 94%; margin: 0 auto 10%;}
#concept-in .con-box3 .txt1 { margin-bottom: 5%;}

#concept-in .con-box4 { width: 94%; margin: 0 auto 10%;}
#concept-in .con-box4 .txt-set .txt { margin-bottom: 5%;}

#concept-in .con-box5-in { width: 94%; margin: 0 auto 10%;}
#concept-in .con-box5 .txt1 { margin-bottom: 5%;}
#concept-in .con-box5 .txt1 p,
#concept-in .con-box5 .txt2 p { margin-bottom: 5%;}

#concept-in .con-box6 { width: 94%; margin: 0 auto 15%;}
#concept-in .con-box6 .tl { font-size: 1.8rem; font-weight: bold; margin-bottom: 15%;}
#concept-in .con-box6 .tl span { color: #F3C420;}

.link_releated { width: 100%; margin: 0 auto; background: #000; padding: 5% 3%;}
.link_releated .tl { color: #fff; font-family: 'Oswald', sans-serif; font-size: 1.6rem; line-height: 1; margin-bottom: 5%; text-align: center;}
.link_releated li { width: 49%; margin-right: 1%;}
.link_releated li:nth-child(2n) { margin-right: 0;}
}
