/**********
top
**********/
#main-vis::before{content: ""; display: block; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; z-index: 5;}
#main-vis #main-vis_title{position: absolute; top: 50%; left: 0%; margin-top: -168px; z-index: 6; width: 100%;text-align: center;}
#main-vis #main-vis_title img{ max-width: 1300px; width: 1300px;height: auto;}
#main-slider{position: relative; width: 100%; height: 100vh; overflow: hidden;}
#main-slider li.slide_item{width: 100%; height: 100vh; background-position: center center; background-repeat: no-repeat; background-size: cover;}
#main-slider li.slide_item{position:absolute;top:0;display:none;background-size:cover;background-position:center center;}
#main-slider li.slide_item.in{-webkit-transform:scale(1);transform:scale(1);z-index:2;}
#main-slider li.slide_item.out{-webkit-transform:scale(1.10);transform:scale(1.10);-webkit-transition:7s;transition:7s;z-index:1;}
@media only screen and (max-width :1500px) {
#main-vis #main-vis_title{left: 0%; margin-top: -100px; padding: 0 10px;  max-width:inherit; width:100%;}
}
@media only screen and (max-width :768px) {
#main-vis,
#main-vis::before,
#main-slider li.slide_item{height: 80vh; overflow: hidden;}
#main-slider li{width: 100%;}
#main-vis #main-vis_title{left: 0%; top:50%; margin: -100px auto; padding: 0 10px;  max-width:inherit; width:100%;}
#main-vis #main-vis_title img{ max-width: 100%; width: 100%;height: auto;}
}
/* top_news*/
#top_news{ background-color: #B6B9BA; color: #fff; position: absolute; bottom: 0; left: 0; width: 100%; z-index: 7; padding: 8px 0;}
#top_news .top_news_btn .link_btn{background-color: #fff; color: #333; font-size: 1.4rem; padding-top: 8px; padding-bottom: 8px; min-width: 115px; width: auto;}
#top_news .top_news_btn .link_btn::after{border-color: #999;}
#top_news li{width: 950px !important;}
#top_news li a{line-height: 1.4px; padding: 5px 0 5px 110px;color: #fff;}
#top_news li span{position: absolute;}

@media only screen and (max-width :768px) {
#top_news{padding: 8px 0px;}
#top_news .top_news_btn{ text-align: center;}
#top_news .top_news_btn a{margin-bottom: 0; width: 100%; display: block;}
#top_news li{padding: 5px 0;}
#top_news li{width: 100% !important;}
#top_news li a{line-height: 1.6px; padding: 10px 0;color: #fff; display: block; font-size: 1.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#top_news li span{ display: block; position: static;}
}
/* box1*/
.top #box1{ line-height:2.6; letter-spacing: 2px; }
.top #box1 .box_tit{margin-top: 40px;}

/* box2*/
.top #box2 .top_about ul > li{ position: relative; min-height: 150px; padding: 50px 0; text-align: center; margin-bottom: 0; overflow: hidden; }
.top #box2 .top_about ul > li::before{ content: "";background-position: center center; background-repeat:no-repeat; width: 100%; height: 100%; position: absolute; top:0; left: 0; background-size: cover; transition: .5s; z-index: 0;}
.top #box2 .top_about ul > li:hover::before{transform: scale(1.2);}
.top #box2 .top_about ul > li a{color: #fff; position: relative; z-index: 2; display: block;}
.top #box2 .top_about ul > li a span{display: block;}
.top #box2 .top_about ul > li::after{content: ""; display: block; width: 100%; height: 100%; background-color: #000; opacity: 0.7; position: absolute; top: 0; left: 0; z-index: 1;}
.top #box2 .top_about ul {align-items: center;}
.top #box2 .top_about li .top_about_disp{ background-color: rgba(255,255,255,0.90); padding: 35px 5%; margin: 0 5%; z-index: 2; position: relative; text-align: left;}
.top #box2 .top_about ul > li .block_tit{ margin-bottom:30px;text-align: center; }
.top #box2 .top_about ul > li .top_about_btn .link_btn{margin-left: auto; margin-right: auto;}
.top #box2 .top_about ul > li.top_about1::before{background-image: url("images/top/top_about01.jpg");}
.top #box2 .top_about ul > li.top_about2::before{background-image: url("images/top/top_about02.jpg");}
.top #box2 .top_about ul > li.top_about3::before{background-image: url("images/top/top_about03.jpg");}
.top #box2 .top_about ul > li.top_about4::before{background-image: url("images/top/top_about04.jpg");}
.top #box2 .top_about ul > li.top_about5::before{background-image: url("images/top/top_about05.jpg");}
.top #box2 .top_about ul > li.top_about6::before{background-image: url("images/top/top_about06.jpg");}

/* box3*/
/* box4*/
.top #box4 { position: relative; height: 700px; overflow: hidden;}
.top #box4::before{ content: ""; display: block; width: 5vw; margin-left: -5%; height:1100px; background-color: #fff; transform: rotate(40deg); position: absolute; top: -160px; left: 50%; z-index: 10;}
.top #box4 > *{ position: absolute; width: 70%;}
.top #box4 .box4_box{box-sizing: border-box; background-repeat: no-repeat; background-size: cover;  height: 560px; display: flex; align-items: center;}
.top #box4 .box4_box .top_about_disp{ background-color: rgba(255,255,255,0.90); padding: 35px 5%; z-index: 2; position: relative; text-align: left; max-width:40%; line-height: 1.6; }
.top #box4 .box4_box .top_about_disp .block_tit{margin-bottom: 25px;}
.top #box4 .box4_box .top_about_disp .block_tit::after{margin: 25px auto 0 auto;}
.top #box4 .box4_box .top_about_btn{text-align: center;}
.top #box4 .top_environment { top: 0; left: -5%;background-position: 100% 50%; background-image:url("images/top/top_environment.png");}
.top #box4 .top_environment .top_about_disp{ margin: 30px auto 30px 15%;}
.top #box4 .top_office { top: 75px; right: -5%; background-position: 0% 50%; background-image:url("images/top/top_office.png") ;}
.top #box4 .top_office .top_about_disp{ margin: 30px 15% 30px auto;}

/* box5*/
.top #box5{background: url("images/common/bg_line.gif") no-repeat top center; padding: 80px 0;}
.top #box5 ul li:nth-child(2n){margin-top: 70px;}
.top #box5 ul li .box5_img{border: 1px solid #ddd; background-color: #fff;}
.top #box5 ul li .box5_img img{width: 100%; height: auto;}

/* box6*/
#box6{ background-color: #e4e4e4; position: relative;}
#box6 .box_tit,
#box6 .top_blog ul{position: relative; z-index: 1;}
#box6 .top_blog li {overflow: hidden;}
#box6 .top_blog li .box6_img{border: 1px solid #ddd; background-color: #fff; text-align: center;}
#box6 .top_blog li .box6_img img{ margin: 0 auto; height: 218px; width:auto;}
#box6 #particles-js{width:100%;height:100%;background-color:#e4e4e4;background-size:cover;background-position:50% 50%;background-repeat:no-repeat; position: absolute; top: 0; left: 0; z-index: 0;}


@media only screen and (max-width :768px) {
	
/* box1*/
.top #box1{ line-height:2.0; letter-spacing: 1px; padding-top: 0; }
.top #box1 .box_tit{margin-top: 0px;}
.top #box1 .img_right{display: none;}
.top #box1 .sp_img_right{ width: 160px; height: auto; float: right;}
.top #box1 .top_message_btn{text-align: center;}

/* box2*/
.top #box2 .top_about ul > li{ padding: 25px 0;}
.top #box2 .top_about ul > li.top_about1,
.top #box2 .top_about ul > li.top_about2,
.top #box2 .top_about ul > li.top_about3{width: 33.3%; min-height: 100px;}
.top #box2 .top_about ul > li.top_about4,
.top #box2 .top_about ul > li.top_about5,
.top #box2 .top_about ul > li.top_about6{ width: 100%;}
.top #box2 .top_about li .top_about_disp{ padding: 15px 5%; }
.top #box2 .top_about ul > li .block_tit{ margin-bottom:15px;}

/* box3*/

/* box4*/
.top #box4 { position:static; height:auto; overflow:auto;}
.top #box4::before{ display: none;}
.top #box4 > *{ position:static; width: 100%;}
.top #box4 .box4_box{box-sizing: border-box; background-repeat: no-repeat; background-size: cover; height:auto; display: flex; align-items: center;}
.top #box4 .box4_box .top_about_disp{padding: 15px 5%; width: auto; max-width: inherit; display: block; box-sizing: border-box;}
.top #box4 .box4_box .top_about_disp .block_tit{margin-bottom: 15px;}
.top #box4 .box4_box .top_about_disp .block_tit::after{margin: 15px auto 0 auto;}
.top #box4 .box4_box .top_about_btn{text-align: center;}
.top #box4 .top_office,
.top #box4 .top_environment { background-position: 50% 50%; }
.top #box4 .top_office .top_about_disp,
.top #box4 .top_environment .top_about_disp{ margin: 15px 20px; }

/* box5*/
.top #box5{padding: 20px 0;}
.top #box5 ul li{width: 100%;}
.top #box5 ul li:nth-child(2n){margin-top: 0px;}
.top #box5 ul li .box5_img{border: 1px solid #ddd; background-color: #fff;}

}



/**********
about
**********/

/* vision
-----------------------------------------------*/
.vision #mission,
.vision #vision,
.vision #culture{border-bottom: 1px #ddd solid;}
.vision #mission.box,
.vision #vision.box,
.vision #culture.box{padding: 120px 0;}
.vision .vision_box{text-align: center; line-height: 2.5;}

/* business
-----------------------------------------------*/
.business .business_list ul > li{display: flex; justify-content: center;}
.business .business_list ul > li::before{ content: ""; display: block; width: 50%; height: 545px; background: no-repeat top center; background-size: cover;}
.business .business_list ul > li .business_list_box{width: 50%; display: flex; align-items: center;}
.business .business_list ul > li .business_list_detail.cont{width: 600px; max-width: 600px; line-height: 2.5;}
.business_list ul > li#business_list02{flex-direction: row-reverse;}
.business_list ul > li#business_list01::before{ background-image: url("./images/about/about_business01.jpg")}
.business_list ul > li#business_list02::before{ background-image: url("./images/about/about_business02.jpg")}
.business_list ul > li#business_list03::before{ background-image: url("./images/about/about_business03.jpg")}

@media only screen and (max-width :768px) {
	/* vision
-----------------------------------------------*/
.vision #mission.box,
.vision #vision.box,
.vision #culture.box{padding: 40px 0;}
.vision .vision_box{line-height: 2.0;}
  
/* business
-----------------------------------------------*/
.business .business_list ul > li{ display: block;}
.business .business_list ul > li::before{ width: 100%; height: 200px; margin-bottom: 15px;}
.business .business_list ul > li .business_list_box{width: 100%; padding-bottom: 25px; }
.business .business_list ul > li .business_list_detail.cont{width:auto; max-width: auto; line-height: 2.5;}
.business_list ul > li#business_list02{}

/* company
-----------------------------------------------*/
.company .main_table th.w30p{width: 100% !important;}
}


/**********
work
**********/
/* work common */
.work_box{background: url("images/work/work_list_bg1.png") 100% 0 repeat-y, url("images/work/work_list_bg2.png") 0 0px repeat-y; overflow: hidden;}
.work_box .work_list_box {margin-bottom: 60px;}
.work_box .work_list_box.work_l{flex-direction: row;}
.work_box .work_list_box.work_r{flex-direction:row-reverse;}
.work_box .work_list_box .work_box_detail{ width: 490px; padding-top: 20px; margin-bottom: 40px;}

/* work index */
.work.index #works-images_box{background: url("images/work/main_work_index.jpg") no-repeat top center; background-size: cover; height: 80vh; width: 100%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;flex-direction: column; margin-top: 76px;}
.work.index #works-images_box #main-images_title{background-color: #fff; margin-bottom: 60px; padding: 30px 0; text-align: center; max-width: 340px; margin-left: auto; margin-right: auto; width: 100%; font-weight: bold; }
.work.index #works-images_box #main-images_title span{display: block;}
.work.index #works-images_box #main-images_catch{width: 100%; text-align: center;}

.work.index #breadcrumb{ margin: 15px 0;}
.work .work_list{background: url("images/common/bg_line.gif") repeat-y center top; padding: 60px 0; overflow: hidden;}
.work .work_list .work_list_box{display: flex; justify-content: center; margin-bottom: 65px;}
.work .work_list .work_list_box .work_list_img{ position: relative; z-index: 0}
.work .work_list .work_list_box .work_list_detail{ position: relative; z-index: 1; display: flex; align-items: center;}
.work .work_list .work_list_box .work_list_detail .work_list_contents{background-color: #fff; padding: 60px 75px; box-shadow: 0px 0px 9px -2px #eaeaea;}

.work .work_list .work_list_box.r_w_box{ flex-direction: row-reverse;}
.work .work_list .work_list_box.r_w_box .work_list_detail{margin-right: -50px;}
.work .work_list .work_list_box.l_w_box .work_list_detail{margin-left: -50px;}
.work .work_list .work_list_box.r_w_box .work_list_img{margin-right: -330px;}
.work .work_list .work_list_box.l_w_box .work_list_img{margin-left: -330px;}

#hagi_office .slick-slide img {margin: 0 auto;}

/* work number */
.work .number_list li{ background-color: #F8F8F8; text-align: center; padding: 29px; box-sizing: border-box; width: 540px; margin-right: 20px; margin-bottom: 20px;}
.work .number_list li:nth-child(2n){margin-right: 0 !important;}
.work .number_list li .sub_tit{font-size: 3.0rem; letter-spacing: 5px;}
.work .number_list li .sub_tit::after{margin-left: auto; margin-right: auto;}


/* work camp */
.work.camp{ background: url("images/work/camp_main_bg.gif") top center repeat-x #F6F6F6;}
.work #camp-images_box{background: url("images/work/main_work_camp.jpg") center center no-repeat; background-size: cover; display: flex; justify-content: center; align-content: center; height: 60vh; color: #fff; flex-wrap: wrap; margin:76px 2% 50px 2%;}
.work #camp-images_box #main-images_title,
.work #camp-images_box #main-images_catch{margin-bottom: 10px; width: 100%; text-align: center;}
.work #camp-images_box #main-images_title{max-width: 370px;}
.work #camp-images_box #main-images_catch{line-height: 2.6; letter-spacing: 3px;}

.work .camp_logo{justify-content: center;}
.work .camp_logo > *{ width: 260px; margin: 0 30px 30px 30px; text-align: center;}
.work .camp_logo .camp_logo_tit{ letter-spacing: 4px;}
.work .camp_logo .space_logo .camp_logo_tit{color: #48ADC6;}
.work .camp_logo .space_logo .camp_logo_btn .link_btn{background-color: #48ADC6;}
.work .camp_logo .tools_logo .camp_logo_tit{color: #FF3355;}
.work .camp_logo .tools_logo .camp_logo_btn .link_btn{background-color: #FF3355;}
.work .camp_logo .culture_logo .camp_logo_tit{color: #24C18A;}
.work .camp_logo .culture_logo .camp_logo_btn .link_btn{background-color: #24C18A;}

/*main_camp_title*/
.work .main_camp_title{margin-bottom: 60px; justify-content:flex-end; position: relative;display: flex;}
.work .main_camp_title .camp_box_tit{background-color: #A6A6A6; color: #fff; text-align: center; padding: 50px 0; align-content: center;flex-wrap: wrap; height: 280px; width: 700px; position: absolute; top: 50%; left: 0; margin-top: -140px;  align-self: center; z-index: 1;}
.work .main_camp_title .main_camp_sub_img{position: relative; z-index: 0; margin-right: -250px;}
.work .main_camp_title.main_camptitle_r{justify-content: flex-start;}
.work .main_camp_title.main_camptitle_r .camp_box_tit{left: auto; right: 0;}
.work .main_camp_title.main_camptitle_r .main_camp_sub_img{margin-right: 0; margin-left: -250px;}
 
.work #space_detail_box ul > *{margin-bottom: 40px;}

/*  space  */
.work #space{background: url("images/work/camp_bg.gif") repeat-y 50% 0; padding-bottom: 0;overflow: hidden;}
.work #space .main_camp_title .camp_box_tit{ background-color: #48ADC6;}
/*  tools  */
.work #tools{background: url("images/work/camp_bg.gif") repeat-y 50% 0; padding-bottom: 0;overflow: hidden;}
.work #tools .main_camp_title .camp_box_tit{ background-color: #FF3355;}
.work #tools .link_btn{background-color: #FF3355;}
/*  culture  */
.work #culture{background: url("images/work/camp_bg.gif") repeat-y 50% 0; padding-bottom: 0;overflow: hidden;}
.work #culture .main_camp_title .camp_box_tit{ background-color: #24C18A;}

/*  ofice  */
.work .ofiice_indoorview{background: url("images/work/work_office_bg.jpg") top center no-repeat; background-size: cover; text-align: center; color: #fff; padding: 40px 0; margin-bottom: 80px;}
.work .ofiice_indoorview h2{letter-spacing: 3px;}
.work .ofiice_indoorview h2::before{content: ""; display: block; width: 48px; height: 32px; background: url("images/work/work_office_logo.png") no-repeat; margin: 0 auto 15px auto;}
.work .ofice_list img{width: 100%; height: auto;}

/*  benefit  */
.work .benefit_list .benefit_num{ font-size: 5.7rem; color: #999999; line-height: 1.5;}
.work .benefit_list .benefit_tit{letter-spacing: 3px;}
.work .benefit_list .benefit_sub{ color: #868686;}

/*  hagi  */
.hagi .hagi_main_bg {padding: 0 20px;} 
.hagi .hagi_main_bg img{width: 100%; height: auto;}
.hagi #hagi_office .cont{width: 1000px;}
.hagi #hagi_office .thumb-slider_main{margin-bottom: 10px;}
.hagi #hagi_office .thumb-slider_thumb img{width: 100%; height: auto;}


@media only screen and (max-width :768px) {
.work.index #works-images_box{ height: 60vh; margin-top: 60px;}
.work.index #works-images_box #main-images_title{max-width: 240px; margin-bottom: 15px; padding: 10px;}
.work.index #works-images_box #main-images_catch{ padding: 0 20px;}

.work .work_list{padding: 30px 0;}
.work .work_list .work_list_box{display: block; margin: 0 10px 0px 0px;}
.work .work_list .work_list_box .work_list_detail{margin-bottom: 15px;}
.work .work_list .work_list_box .work_list_detail .work_list_contents{padding: 25px 30px 15px 30px; margin: 0 10px;}
.work .work_list .work_list_box .work_list_btn{text-align: center;}
.work .work_list .work_list_box.r_w_box{ flex-direction: row;}
  
.work .work_list .work_list_box.r_w_box .work_list_detail,
.work .work_list .work_list_box.l_w_box .work_list_detail,
.work .work_list .work_list_box.r_w_box .work_list_img,
.work .work_list .work_list_box.l_w_box .work_list_img{margin-left: 0; margin-right: 0;}
.work .work_list .work_list_box.r_w_box .work_list_detail,
.work .work_list .work_list_box.l_w_box .work_list_detail{margin-top: -15px;}
  
.work_box{ background-size: 140% auto, 110% auto;}
.work_box .work_list_box .work_box_detail{ width:auto; padding-top: 10px; margin-bottom: 30px;}

.work .ofiice_indoorview{padding: 40px 30px; margin-bottom: 40px;}
.work .ofice_list .layout_box4 li{width: 49%; margin-right: 2%;}
.work .ofice_list .layout_box4 li:nth-child(2n){margin-right: 0;}

.work #camp-images_box{height: 50vh;margin: 60px 10px 25px 10px;}
.work #camp-images_box #main-images_title{max-width: 270px; margin: 0 auto 5px auto;}
.work #camp-images_box #main-images_catch{line-height: 1.6; letter-spacing: 1px;}

.work .camp_logo{justify-content: center;}
.work .camp_logo > *{  margin: 0 auto 15px auto !important; text-align: center;}
.work .camp_logo .camp_logo_tit{ letter-spacing: 2px;}

/*main_camp_title*/
.work .main_camp_title{ flex-direction: column-reverse;}
.work .main_camp_title .camp_box_tit{padding: 25px; height:auto; width:90%; display: block; position: static; margin: -20px auto 15px auto;}
.work .main_camp_title .main_camp_sub_img{position: relative; z-index: 0; margin-right: 0px;}
.work .main_camp_title.main_camptitle_r{justify-content: flex-start; margin-bottom: 0px;}
.work .main_camp_title.main_camptitle_r .camp_box_tit{left: auto; right: 0;}
.work .main_camp_title.main_camptitle_r .main_camp_sub_img{margin-right: 0; margin-left: 0px;}
 
/*  space  */
.work #space,
.work #tools,
.work #culture{padding-bottom: 0;}
.work #space_detail_box ul > *{margin-bottom: 40px;}
  
.hagi #hagi_office .cont{width:auto;}

}


/**********
news
**********/
/* news index */
.news_list{margin-bottom: 30px;}
.news_list dt{position: absolute; padding: 20px 0;}
.news_list dd{border-bottom: 1px solid #eee; padding: 20px 0 20px 150px;}
#wrapper.news #main-images_box{display:none;}

@media only screen and (max-width :768px) {
.news_list dt{position:static; padding: 10px 0 5px 0;}
.news_list dd{padding: 0px 0 10px 0px;}
}


/* 220127 book_info*/
#book_info{background: #fff; border: 1px solid #eee; padding: 28px 55px; width: 1200px; max-width: 1200px;}
#book_info .book_info_img{flex-basis: 196px; margin-right: 25px;}
#book_info .book_info_box dl{flex: 1;}
#book_info .book_info_box dl .book_info_sub{background-color: #38BDD8; color: #fff; padding: 13px 20px; margin-bottom: 13px; line-height: 1.2; font-weight: bold;}
@media only screen and (max-width :768px) {
#book_info{width:auto; max-width:inherit;}
#book_info .book_info_wrp {display: flex;}
}
@media only screen and (max-width :415px) {
#book_info {padding: 15px 5%;}
#book_info .book_info_wrp {display:block;}
#book_info .book_info_img{flex-basis:auto; display: block; text-align: center;  margin-right:0px; text-align: center;}
#book_info .book_info_img img{margin: 0 auto 15px auto;}
}