@charset "utf-8";
/* Concept */
.home-section{background-position: left bottom;}
.home-h1{font-size: 42px; letter-spacing: 0.1em; position: relative; margin-top: 340px; color: #fff;}

.concept-txt{padding: 50px 0 100px; text-align: center; font-size: 18px; line-height: 2.2;}
.concept-tit{font-size: 28px; line-height: 1.6; margin: 0 0 0.5em;}
.concept-desc{font-size: 17px; line-height: 1.9;}

.concept-intro{display: flex; flex-wrap: wrap; margin: 0 0 60px; width: 100%;}
.concept-intro .img{width: 47%;}
.concept-intro .inner{padding: 30px 0 0 0; width: 53%;}

.concept-wrap{position: relative;}
.concept-label{width: 64.5%; position: absolute; top: 0; left: 0; z-index: -1;}
.concept-box1{margin: 350px 0 200px; display: flex; justify-content: flex-end;}
.concept-box1 .inner{max-width: 750px;}
.concept-box1 .tit{font-size: 41px; margin: 0 0 0.5em;}
.concept-box1 .tit span{margin-left: -0.6em;}
.concept-box1 .desc{font-size: 18px; line-height: 2.2;}

.concept-box2{margin: 0 0 110px; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.concept-box2 .inner{width: 53%;}
.concept-box2 .img{width: 47%;}

.concept-box3{margin: 0 0 80px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.concept-box3 .img{width: 44.6%;}
.concept-box3 .cap{padding: 5px 0 0 0; font-size: 13px;}
.concept-box3 .inner{width: 51%;}
.concept-box3 .imgFlex{display: flex; justify-content: space-between;}
.concept-box3 .imgFlex .photo1{width: 65.62%;}
.concept-box3 .imgFlex .photo2{width: 31.44%;}

@media only screen and (max-width: 1024px){
    .home-h1{font-size: 30px; letter-spacing: 0;}
    
    .concept-txt{font-size: 16px;}
    .concept-tit{font-size: 20px;}
    .concept-desc{font-size: 14px;}
    
    .concept-box1{margin: 200px 0 110px;}
    .concept-box1 .tit{font-size: 30px;}
    .concept-box1 .desc{font-size: 14px;}
    
    .concept-box3 .cap{font-size: 10px;}
}

@media only screen and (max-width: 768px) {
    .home-h1{font-size: 6vw; margin: 250px 0 200px;}
    .concept-txt{text-align: left; padding: 50px 0;}
    
    .concept-intro{flex-wrap: wrap;}
    .concept-intro .inner{width: 100%; padding: 20px 0 0 0;}
    .concept-intro .img{width: 100%; margin: 0 auto;}
        
    .concept-label{width: 100%;}
    
    .concept-box1{margin: 45vw 0 60px;}
    .concept-box1 .tit{font-size: 22px;}    
    .concept-box1 .img{width: 100%; padding: 30px 0 0 0;}
    
    .concept-box2{margin: 0 0 60px;}
    .concept-box2 .inner{width: 100%; margin: 0 0 20px;}
    .concept-box2 .img{width: 100%;}
    
    .concept-box3{margin: 0 0 60px;}
    .concept-box3 .inner{width: 100%; order: -1; margin: 0 0 20px;}
    .concept-box3 .img{width: 100%;}
}