@charset "utf-8";

.main_page main{margin-top:84px;}

.load_overlay{position:fixed; top:0; left:0; width:100%; height:100vh; background: #ffffff; z-index: 9999; overflow: hidden; }
.load_overlay .inner_overlay{position: fixed; top:50%; left:50%; transform: translate(-50%, -50%); width:180px; }
.load_overlay .inner_overlay #overlay_logo{ transform: translateY(20px); opacity:0; visibility: hidden;}
/* .load_overlay .inner_overlay svg{transform: translateY(40px);  fill: #ffffff;  opacity:0; visibility: hidden;} */



.visual_wrap{padding-top:0; position:relative; overflow: hidden; display: flex; align-items: flex-end; height:calc(100vh - 85px);}
.visual_wrap .visual_info_wrap {width:35%; padding:0 80px; }
.visual_wrap .visual_info_wrap .visual_text_wrap h2{ font-size:68px; font-weight: 200; line-height: 1.2;  } 
.visual_wrap .visual_info_wrap .visual_text_wrap p{margin-top:16px; font-size:16px;}
.visual_wrap .visual_img_wrap{width:65%; overflow: hidden;}
.visual_wrap .visual_img_wrap .slider_item figure{position: relative; width:100%; height:640px; overflow: hidden;}
.visual_wrap .visual_img_wrap .slider_item figure img{width: 100%; height: 100%; object-fit: cover;}

.slider_control{margin-top:64px; display: flex; }
.visual_slider_btn{position:relative; display: block;  width:36px; height:36px;}
.visual_slider_btn.vs_prev{margin-right:16px;}

.visual_slider_btn::before{content: ""; position:absolute; top:50%; left:50%; display: block; width:60%; height:60%; border-top:2px solid #000000;}
.visual_slider_btn.vs_prev::before{transform: translate(-50%, -50%) rotate(-45deg); border-left:2px solid #000000;}
.visual_slider_btn.vs_next::before{transform: translate(-40%, -50%) rotate(45deg); border-right:2px solid #000000;}

.con_wrap{padding-top:200px;}
.con_wrap .section_title h2{ font-size:48px; font-weight: 200; line-height: 1.5;}
.con_wrap .section_title h2 span{position:relative; z-index: 1;}

.main_project .project_list{display: flex; flex-wrap: wrap;}
.main_project .project_list .pj_slider_item{position:relative; width:25%;}
.main_project .project_list .pj_slider_item .text_wrap{position: absolute; top:0; left:0; width:100%; height:100%; background: rgba(49, 113, 181, 0.6); padding: 64px 40px; color:#ffffff; opacity: 0; transition: opacity .3s;}
.main_project .project_list .pj_slider_item .text_wrap h3{font-size:26px; font-weight: 200;}
.main_project .project_list .pj_slider_item a:hover .text_wrap{opacity: 1; }


.main_news {padding-bottom:200px;}
.main_news .inner_wrap{margin:20px -20px 0; display:flex; flex-wrap: wrap;} 
.main_news .inner_wrap>article{padding: 0 20px; width:50%;}
.main_news .inner_wrap .one_news .news_item,
.main_news .inner_wrap .one_news .news_item a{height:100%;}
.main_news .inner_wrap .one_news .news_item a .img_wrap{height:calc(100% - 95px); min-height: 880px;}
.main_news .inner_wrap .one_news .news_item a .img_wrap figure{position: relative; height:100%; overflow: hidden;}
.main_news .inner_wrap .one_news .news_item a .img_wrap figure img{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%)scale(1.2); height:100%; width:auto; }
.main_news .inner_wrap .two_news .news_item .img_wrap figure{position: relative; height:372px; overflow: hidden;}
.main_news .inner_wrap .two_news .news_item .img_wrap figure img{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%)scale(1.2); }
.main_news .inner_wrap .news_item .img_wrap {position: relative; overflow: hidden;}
.main_news .inner_wrap .news_item .img_wrap .news_overlay{position: absolute; top:0; left:0; width:100%; height:100%; background: rgba(49, 113, 181, 0.6); opacity: 0; visibility: hidden; transition: opacity, visibility .3s;}
.main_news .inner_wrap .news_item .img_wrap .news_overlay::before{content: ""; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); display: block; width:6px; height:48px; background: #ffffff;}
.main_news .inner_wrap .news_item .img_wrap .news_overlay::after{content: ""; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); display: block; width:48px; height:6px; background: #ffffff;}
.main_news .inner_wrap .news_item a:hover .img_wrap .news_overlay{ opacity: 1; visibility:visible;}
.main_news .inner_wrap .two_news .news_item:nth-child(n+2){margin-top:48px;}
.main_news .inner_wrap .news_item .text_wrap{margin-top:20px;}
.main_news .inner_wrap .news_item .text_wrap .news_date{font-size:18px; color:#777777; }
.main_news .inner_wrap .news_item .text_wrap h3{font-size:24px; font-weight: 200; }

.main_inquiry{padding:200px 0;  background: url("../images/main/main_inquiry_bg.jpg")no-repeat center / cover;}
.main_inquiry .wrap{display: flex; justify-content: center;}
.main_inquiry .wrap .text_wrap{text-align: center}
.main_inquiry .wrap .text_wrap h2{font-size: 68px; font-weight: 200; color:#ffffff; line-height: 1.5;}
.main_inquiry .wrap .text_wrap a{position: relative; margin-top:20px; padding:8px 8px 4px;  display: inline-block; font-size:20px; color:#ffffff; transition:background-color .3s;}
.main_inquiry .wrap .text_wrap a::before{content: ""; position: absolute; bottom:0; left:50%; transform:translateX(-50%); display: block; width:0; height:1px; opacity: 0; transition: opacity, width, .3s; background: #ffffff;  }
.main_inquiry .wrap .text_wrap a:hover::before{width:100%;  opacity: 1;  }



@media(max-width:1600px) {

    .visual_wrap .visual_info_wrap{width: 40%;}
    .visual_wrap .visual_img_wrap{width: 60%;}
    .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 72px;}
  
}

@media(max-width:1440px) {
    .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 64px;}
    .visual_wrap .visual_info_wrap .visual_text_wrap p {font-size: 18px;}
    
    .main_inquiry .wrap .text_wrap a {font-size: 18px;}
    
}

@media(max-width:1240px){       

    /* .visual_wrap {height: 680px;} */
    .visual_wrap .visual_info_wrap{width: 50%;}
	  .visual_wrap .visual_img_wrap{width: 50%;}
    .visual_wrap .visual_img_wrap .slider_item figure {height: 560px;}
    .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 56px;}

    .con_wrap .section_title h2 {font-size: 48px;}

    .main_project .project_list .pj_slider_item .text_wrap {padding: 36px 28px;}
    .main_project .project_list .pj_slider_item .text_wrap h3 {font-size: 20px;}
        
    .main_news .inner_wrap .one_news .news_item a .img_wrap {height: calc(100% - 66px);}
    .main_news .inner_wrap .two_news .news_item .img_wrap figure {height: 280px;}    
    .main_news .inner_wrap .news_item .text_wrap { margin-top: 10px;}
    .main_news .inner_wrap .news_item .text_wrap h3 {font-size: 20px; font-weight: 200; line-height: 1.4;}    
    .main_news .inner_wrap .news_item .text_wrap .news_date {font-size: 16px;}
   
    .main_inquiry {padding: 200px 0;}
    .main_inquiry .wrap .text_wrap h2 {font-size: 56px;}
    .main_inquiry .wrap .text_wrap a {font-size: 16px;}
}


@media(max-width:1024px) {   

    .main_page main{margin-top:56px;}

    /* .visual_wrap {height: 560px;} */
    .visual_wrap .visual_img_wrap .slider_item figure {height: 480px;}  
    .visual_wrap .visual_info_wrap {padding: 0 40px;}
    .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 48px;}
    .visual_wrap .visual_info_wrap .visual_text_wrap p {font-size: 16px;}
           
    .con_wrap {padding-top: 160px;}
    .con_wrap .section_title h2 {font-size: 40px;}

    .news {padding-bottom: 160px;}
    .main_news .inner_wrap .two_news .news_item .img_wrap figure {height: 240px;}

    .main_inquiry {padding: 160px 0;}
    .main_inquiry .wrap .text_wrap h2 {font-size: 40px;}
}


@media(max-width:768px) {  

    .load_overlay .inner_overlay{width:120px; } 

    .visual_wrap {flex-wrap: wrap; height:auto;}
    .visual_wrap .visual_info_wrap {position:relative; margin-top:-80px; order: 1; padding:20px 5% 0; width: 70%; z-index: 2; background: #ffffff; }
	  .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 48px;}
    .visual_wrap .visual_img_wrap{width: 100%;}    
    .visual_wrap .visual_img_wrap .slider_item figure {height: auto;}
    .visual_wrap .visual_img_wrap .slider_item figure img{position: relative; top:0; left:0; transform: translate(0,0); width: 100%; height:auto;}
    .slider_control {margin-top: 32px;}
    .visual_slider_btn {width: 24px; height: 24px;}
    
    .con_wrap .section_title h2 {font-size: 36px;}   

    .main_project .project_list .pj_slider_item {width: 50%;}
    .main_project .project_list .pj_slider_item .text_wrap h3 { font-size: 16px;}

    .main_news .inner_wrap {margin: 16px -16px 0;}
    .main_news .inner_wrap>article {padding: 0 12px;}
    .main_news .inner_wrap .one_news .news_item a .img_wrap {height: calc(100% - 58px);}   
    .main_news .inner_wrap .two_news .news_item:nth-child(n+2) {margin-top: 40px;}
    .main_news .inner_wrap .two_news .news_item .img_wrap figure {height: 160px;}    
    .main_news .inner_wrap .news_item .text_wrap {margin-top: 6px;}
    .main_news .inner_wrap .news_item .text_wrap .news_date {font-size: 15px;}
    .main_news .inner_wrap .news_item .text_wrap h3 {font-size: 18px;}

    .main_inquiry .wrap .text_wrap h2 {font-size: 32px;}   
    

}


@media(max-width:540px) {
      
    .visual_wrap .visual_info_wrap {position:relative; margin-top:-40px; width: 80%;}
	.visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 36px;}

    .con_wrap {padding-top: 100px;}
    .con_wrap .section_title h2 {font-size: 32px;}
    

    .news {padding-bottom: 100px;}
    .main_news .inner_wrap>article {width: 100%;}
    .main_news .inner_wrap .one_news .news_item, 
    .main_news .inner_wrap .one_news .news_item a {height: auto;}
    .main_news .inner_wrap .one_news .news_item a .img_wrap {height: auto; min-height: auto;}
    
    .main_news .inner_wrap .one_news .news_item a .img_wrap figure {height: 200px;}
    .main_news .inner_wrap .one_news .news_item a .img_wrap figure img {height: auto; width: 100%;}
    .main_news .inner_wrap .two_news {margin-top: 40px;}
    .main_news .inner_wrap .two_news .news_item .img_wrap figure {height: 200px;}


    .main_inquiry {padding: 100px 0;}
    .main_inquiry .wrap .text_wrap h2 {font-size: 28px;}
    
  
}

@media(max-width:480px) {

    .visual_wrap .visual_info_wrap {position:relative; margin-top:0; width: 100%;}
    .visual_wrap .visual_info_wrap .visual_text_wrap h2 {font-size: 35px;}
    .visual_wrap .visual_info_wrap .visual_text_wrap p {margin-top: 7px; font-size: 15px;}

    .con_wrap .section_title h2 {font-size: 28px;} 
    .con_wrap .section_title h2 br{display: none;} 

  

}
