@charset "utf-8";
/* CSS Document */

@media only screen and (max-width:1320px){
    
    header #pc_nav .menu ul{width: 100%;}
	
	#content { width: 85%; }
    
	.content_float_box { width: 100%; }
    .topics_content{ background-size: contain; }
    .topics_wrapper{ width: 70%; }
    
    .page-head-ttl{width: 80%;}
    
    .top_img_item img{object-fit: cover; height: 330px;}
}


@media only screen and (max-width:1024px){
	
	header #pc_nav { width: 48%; }
	header #pc_nav .menu ul { width: 85%; }
    
    .page-head-ttl{
        padding-bottom: 0px;
        padding-top: 20px;
    }
    
    /*トップページ*/
    .top_banner_flex{ width: 90%; justify-content: space-between;}
    .banner_illust{width: 48%;}
    .banner_text{width: 65%;}
    
    #vegas .caption p{
        font-size: 40px;
        line-height: 1em;
    }
    
    .common_list dt{width: 15%;}

}

@media only screen and (max-width:912px){
    /* header */
	header { margin: 20px 0; }
	header .logo { position: relative; width: 270px; margin: 0 0 0 40px; z-index: 9999; }
	header .logo a { font-size: .8em; line-height: 1em; }
	header .logo a span { font-size: .35em; line-height: 1em; margin-top: 5px; }
	
	header #pc_nav { display: none; }

	/* content */
	#content { width: 90%;}
	
	/* slide */
	#vegas { height: 60vh; }
	#vegas .caption { left: 5%; font-size: 2.5em; }
	
	/* sp menu */
	.button_container {
		display: block;
  		position: fixed;
  		top: 3%;
  		right: 5%;
  		height: 27px;
  		width: 45px;
  		cursor: pointer;
  		z-index: 100;
  		-webkit-transition: opacity .25s ease;
  		transition: opacity .25s ease;
		z-index: 2000;
	}
	.button_container:hover {
  		opacity: .7;
	}
	.button_container.active .top {
  		-webkit-transform: translateY(11px) translateX(0) rotate(45deg);
        transform: translateY(11px) translateX(0) rotate(45deg);
  		background: #fff;
	}
	.button_container.active .middle {
  		opacity: 0;
  		background: #fff;
	}
	.button_container.active .bottom {
  		-webkit-transform: translateY(-18px) translateX(0) rotate(-45deg);
    	transform: translateY(-18px) translateX(0) rotate(-45deg);
		background: #fff;
	}
	.button_container span {
		background: #fff;
		border: none;
		height: 5px;
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		-webkit-transition: all .35s ease;
		transition: all .35s ease;
		cursor: pointer;
	}
	.button_container span:nth-of-type(2) {
		top: 15px;
	}
	.button_container span:nth-of-type(3) {
		top: 30px;
	}

	.overlay {
		display: block;
		position: fixed;
		background: #00A26A;
		top: 0;
		left: 0;
		width: 100%;
		height: 0%;
 		 opacity: 0;
		visibility: hidden;
		-webkit-transition: opacity .35s, visibility .35s, height .35s;
		transition: opacity .35s, visibility .35s, height .35s;
		overflow: hidden;
	}
	.overlay.open {
		opacity: 1;
		visibility: visible;
		height: 100%;
		z-index: 1000;
	}
	.overlay.open li {
		-webkit-animation: fadeInRight .5s ease forwards;
		animation: fadeInRight .5s ease forwards;
		-webkit-animation-delay: .35s;
		animation-delay: .35s;
	}
	.overlay nav {
		position: relative;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width: 70%;
		margin: 0 auto;
	}
	.overlay ul {
		list-style: none;
		padding: 0;
		margin: 0 auto;
		display: inline-block;
		position: relative;
		height: 100%;
	}
	.overlay ul li {
		display: block;
		height: 15%;
		height: calc(100% / 6);
		min-height: 30px;
		position: relative;
		opacity: 0;
	}
	.overlay ul li::before {
    	content: "";
    	position: absolute;
    	top: 50%;
    	left: -50px;
    	width: 30px;
    	height: 1px;
    	background: #fff;
	}
	.overlay ul li a {
		display: block;
		position: relative;
		padding: 1em 0;
		font-size: 1.5em;
		font-style: bold;
		font-weight: 400;
		color: #fff;
		text-decoration: none;
		line-height: 2em;
		letter-spacing: .05em;
		overflow: hidden;
	}
	.overlay ul li a span {
		font-size: .6em;
		color: #fff;
		margin-left: 20px;
	}
	.overlay ul li a:hover:after, .overlay ul li a:focus:after, .overlay ul li a:active:after {
		width: 100%;
	}

	@-webkit-keyframes fadeInRight {
		0% { opacity: 0; left: 20%; }
		100% { opacity: 1; left: 0; }
	}

	@keyframes fadeInRight {
		0% { opacity: 0; left: 20%; }
		100% { opacity: 1; left: 0;	}
	}
	
	.button_container span.change-color { background-color: #8CC63F; }
    
    .topics_Box,.top_banner,.common_wrapper{box-shadow: 10px 10px 0 #c3e2d7;}
    
    .topics_Box{ padding: 40px 45px;}
    
}

@media only screen and (max-width:820px){
    
    .banner_text h5{ font-size: 1em;}
    .contact_tit h5{font-size: 1em;}
    
    .page-head{padding: 265px 0 140px;}
    
    .top_text_item h4{font-size: 1.8em;}
	
    .recruit_content01 .recruit_txt p{font-size: 16px;}
    .recruit_content01 .recruit_tit{font-size: 1.2em;}
	
}

@media only screen and (max-width:768px){
    
    .pc{display: none}
    
    .sp{display: block;}
    
    .sp-br{display: none;}
	
	/*TOP-お知らせ*/
    .topics_content{
        flex-direction: column;
        width: 100%;
        padding: 90px 0;
    }
    
    .topics_Box{width: 100%;}
    
    .topics_tit{
        width: 100%;
        max-width: 100%;
        display: flex;
        align-items: center;
        margin-bottom: 30px;
    }
    
    .topics_tit h3{margin-bottom: 0;}
    
    .tit_inner{width: 30%;}
    
    .btn_inner{ width: 70%;}
    
    /*TOP-会社案内*/
    .top_company_flex{
        width: 100%;
        flex-direction: column;
        padding: 0;
    }
    
    .top_company_Box{
        padding: 50px 40px 60px 40px;
    }
    
    .top_img_item img{
        object-fit: contain;
        height: 100%;
    }
    
    .inner {padding: 5em 0 5em 0;}
    
    .top_img_item,.top_text_item{width: 100%;}
    .top_text_item{margin-left: 0px; margin-top: 20px;}
    
    .more_btn_inner{text-align: center;}
    
    /*TOP-求人情報*/
    .top_banner_flex{ flex-direction: column;}
    .banner_text{ width: 100%; margin-top: 30px;}
    .banner_text h5{ font-size: 1.4em;}
    .banner_illust{width: 60%;}
    
    /*TOP-お問い合わせ*/
    .contact_box{flex-direction: column;}
     
    .contact_tit{
        border-bottom: solid 4px #E8E3E3;
        border-right: none;
        padding-bottom: 35px;
        width: 90%;
    }
    
    .contact_tit h5{font-size: 1.4em;}
    .contact_text{padding-top: 35px; width: 90%;}
    
    /*会社案内*/
    .company_flex{flex-direction: column;}
    .company_img_item,.company_text_item{width: 100%;}
    .company_text_item{margin-top: 20px;}
    
    .service_flex{ flex-direction: column;}
    
    .service_img{
        width: 100%;
        margin-bottom: 40px;
    }
    
    .name_img{
        width: 200px;
        padding: 10px;
        font-size: 15px;
    }
    
    /*お知らせ*/
    .topics li{
        flex-direction: column;
        align-items: flex-start;
    }
    
    .topics li .day{margin: 10px 0;}
    .topics_nav a{font-size: 15px;}
    
    
    
}

@media only screen and (max-width:640px){
    
    .br_sp{display: none;}
	
	/* header */
	header { margin: 20px 0; }
	header .logo { position: relative; width: 240px; margin: -3px 0 0 20px; z-index: 9999; }
    
    #vegas {
        width: 100%;
        height: 550px;
        margin: auto;
        position: relative;
    }
    
    #vegas .caption span{
        font-size: 16px;
        line-height: 0.9em;
        margin-top: 25px;
    }
    
    #vegas .caption { top: 55%; left: 2%; padding-left: 5px; font-size: 2em; }
	#vegas .caption p { margin-top: -10px; font-size: 25px; line-height: 1.2em;}
	#vegas .caption span { font-size: 12px; line-height: 1.2em; margin-top: 15px; }
	#vegas .caption .sp-br { display: block; }
	
	/* sp menu */
	.button_container { height: 27px; width: 35px; }
	.button_container span { height: 4px; }
	.button_container span:nth-of-type(2) { top: 12px; }
	.button_container span:nth-of-type(3) { top: 24px; }
	.button_container.active .top {
		-webkit-transform: translateY(9px) translateX(0) rotate(45deg);
		transform: translateY(8px) translateX(0) rotate(45deg);
		background: #fff;
	}
	.button_container.active .bottom {
		-webkit-transform: translateY(-16px) translateX(0) rotate(-45deg);
		transform: translateY(-16px) translateX(0) rotate(-45deg);
		background: #fff;
	}
    
	.overlay nav { width: 55%; }
	.overlay ul li a { font-size: 18px;  }

	.main_contents { width: 100%; margin: 0 auto; margin-bottom: 0px; padding: 0px 0px; text-align: left; background: #F2F2F2; }
	.main_contents_box01 { width: 100%; margin: 0 auto; background-color: rgba(255,255,255,0); }
	.main_contents_box02 {
		width: 94%;
		max-width: 94%;
		margin: 0 auto;
		padding: 0px 0px 40px 0px;
		font-weight: 300;
		color: #444;
		background: rgba(255,255,255,0);
	}

	.contents_l_box01 { display: none; width: 100%; float: left; padding-top: 80px; background: rgba(51,175,131,1); }
	.contents_r_box01 { width: 100%; float: right; padding-top: 25px; }

	.main_tit01 { padding-bottom: 20px; text-align: center; }
	.main_tit01 table { width: 100%; }
	.main_tit_td01 h1 { font-size: 1.3em; font-weight: 600; margin: 0px; padding: 0px; color: #222; }
	.main_tit_td02 { font-size: .9em; font-weight: 400; vertical-align: middle; padding-left: 10px; }

	.main_tit02 { display: none; }

	.sub_tit01 { padding-bottom: 10px; }
	.sub_tit_td01 h2 { font-size: 17px; font-weight: 500; margin: 0px; padding: 0px; line-height: 28px; color: #33AF83; }
	.sub_tit_td02 { padding-left: 30px; }
	
	/* top */
	/*#vegas { height: 70vh; }*/
	
	
	.scroll-Block { display: none; }
	
	
	/* ※CONTACT */
	.contact-box h2 { font-size: 1.4em; margin: 50px 0 40px 30px; }
	
	.toi_sub_tit01 { font-size: 15px; font-weight: 500; line-height: 25px; color: #222; margin-bottom: 25px; }

	.toi_m_tit01 { 
		padding-bottom: 10px;
		padding-left: 15px;
		font-size: 40px;
		font-weight: 400;
		line-height: 45px;
		border-left: 5px rgba(69,177,199,1) solid;
	}
	.toi_m_tit02 {
		padding-left: 15px;
		font-size: 18px;
		color: rgba(69,177,199,1);
		border-left: 5px rgba(69,177,199,1) solid;
		margin-bottom: 30px;
	}

	.toi_box01 { background: rgba(255,255,255,0.5); }
	.toi_box01 a { text-align: center; color: #009964; }

	.toi_tit01 { width: 100%; padding-bottom: 5px; text-align: center; }
	.toi_tit01 h1 { margin: 0px; font-size: 28px; font-weight: 600; line-height: 35px; color: #444; }

	.toi_txt01 { line-height: 22px; text-align: justify; padding-bottom: 20px; }
	.toi_txt02 { line-height: 25px; text-align: justify; padding-bottom: 0px; margin-bottom: 10px; font-size: 15px; }
	.toi_txt02 br { display: block; }

	.toi_btn_l { text-align: center; margin-left: 40%; float: left; }

	.toi_btn_r { width: 100px; text-align: center; margin-left: 20px; float: left; }
	.toi_btn_r input { width: 80px; }

	.toi_td1 { padding: 8px 0px 5px 0px; color: #222; font-weight: 400; }
	.toi_td1 span { color: #666; font-size: 12px; }

	.toi_td2 { padding: 0px; color: #222; }
	.toi_td3 { clear: both; height: 15px; border-bottom: 1px #AAA dashed; }

	.toi_txt1 { font-size: 13px; font-weight: 400; margin-bottom: 20px; }
	.toi_tel1 { font-size: 17px; color: #3578D9; font-weight: bold; }
	.toi_input1 { height: 25px; float: left; border-color: #999; border-width: 0px 0px 1px 0px; border-style: dotted; }

	.from_text01 { padding: 3px; border: 1px #BBB solid; width: 60%; }
	.from_text02 { padding: 3px; border: 1px #BBB solid; width: 30%; }
	.from_text03 { padding: 3px; border: 1px #BBB solid; width: 95%; }

	.toi_space_40_01 { clear: both; height: 40px; }
	
	
	/* footer */
	#footer span { margin-right: 0; }
	#footer .company-name { font-size: .9em; font-weight: 500; }
	.footer_nav ul { width: 90%; margin: 10px auto 30px; padding: 0; float: none; }
	.footer_nav li { display: block; padding: 10px 0; margin: 0; font-size: .9em; text-align: left; border-bottom: 1px #888 solid; }
	
	
	/* hamburger_menu */
	#hamburger_nav {
		position: fixed;
		top: 0;
		left: -240px;
		width: 240px;
		height: 100vh;
		text-align: center;
		background: #373737;
	}

	#hamburger_btn {
		width: 100px;
		height: 100px;
		top: 0;
		left: 0;
		text-indent: -9000px;
		background: #7E7E7E;
	}
	
	/* home_content */
	.home_comment{ width: 100%; height: auto; margin: 0 auto; text-align: center; }

	
	.nav { display: none; }
	#nav { display: block; }
	
	
	/* space */
	.space01 { width: 100%; height: 20px; }
	.short_space { width: 100%; height: 40px; }
	
	
	/* common */
	.page-head { padding: 340px 0 70px 0; }
	.page-head-ttl__main { font-size: 1.3em; }
	.page-head-ttl__sub { font-size: .7em; }
	
	/*TOP-お知らせ*/
    .tit_inner{width: 40%;}
    .topics_Box{padding: 40px 50px;}
    
    /*会社案内*/
    .page-head-ttl__main h2{font-size: 45px;}
    .page-head-ttl__sub{font-size: 20px;}
    
    .common_list{flex-direction: column;}
    .common_list dt,.common_list dd{width: 100%;}
    .common_list dd{padding: 15px 0; font-size: 18px;}
    .common_list dt{padding: 15px 0; font-size: 18px;}
    
    .company_table th{font-size: 12px;}
    .company_table td{font-size: 14px;}
    
    .service_list{flex-direction: column;}
    .service_list dt,.common_list dd{width: 100%;}
    .service_list dd{padding: 15px 0; font-size: 18px; border-bottom: none;}
    .service_list dt{padding: 15px 0; font-size: 18px;}
    
    .setubi_td01,.setubi_td02{font-size: 16px;}
    
    .page-head-ttl__main h2{font-size: 35px;}
    .page-head-ttl__sub{font-size: 20px;}
    
    /*求人募集*/
    .recruit_content01{flex-direction: column; gap:30px;}
    .recruit_content01 .recruit_img{width: 100%;}
    .recruit_content01 .recruit_tit{max-width: 260px; min-width: 200px;}
    .recruit_content01 .recruit_txt{width: 100%;}
    
    /*お問い合わせ*/
    .topics_nav a{font-size: 18px;}
}

@media only screen and (max-width:375px){
        
    
    
}

@media only screen and (max-width:414px){
    
    header .logo { position: relative; width: 220px; margin: -3px 0 0 20px; z-index: 9999; }
    
    header .logo a{font-size: .7em;}
    
    .overlay nav{top: 50%;}
    
    /*TOP*/
    /*#vegas .caption p{font-size: 38px;}
    #vegas .caption{left: 3%;}
    .tit_inner{width: 65%;}*/
    
    .topics_Box li{
        flex-direction: column;
        align-items: flex-start;
    }
    
    .topics_Box li .day{ margin: 10px 0;}
    .topics_Box{ padding: 40px 30px;}
    
    .topics_tit h3,.top-tit02 h3,.banner_text h3,.contact_tit h3{font-size: 30px;}
    .topics_tit p,.top-tit02 p,.banner_text p,.contact_tit p{font-size: 20px;}
    
    .top_company_Box{padding: 40px 0 50px 0;}
    .top_company_flex{padding: 0 25px;}
    .top_text_item h4{font-size: 26px;}
    
    .tit_en span::before{left: 2px; width: 20px;}
    .tit_en{padding-left: 28px;}
    
    .top_text_item p{font-size: 17px;}
    
    .banner_illust{ width: 80%;} 
    
    .contact_inner{padding: 80px 0;}
    .contact_tit h5{margin-top: 15px;}
    .contact_text h4{font-size: 30px;}
    .contact_box{padding: 80px 0;}
    .more_btn_03{font-size: 18px;}
    
    .contact_tit h5,.banner_text h5{font-size: 17px;}
    
    .top_banner{ margin: 90px 0;}
    
    /*共通*/
    .container{padding: 50px 0 100px 0;}
    .common_wrapper{padding: 40px 25px;}
    .common_text{margin-top: 20px;}
    
    /*会社案内*/
    
    .span_ja{font-size: 30px;}
    .company_wrapper{padding: 40px 25px; margin-bottom: 45px;}
    .company_flex{margin-top: 25px;}
    .company_text_item h4{font-size: 26px;}
    .company_text_item p{font-size: 17px;}
    
    /*求人情報*/
    .rec_inner{padding-bottom: 80px; padding-top: 0px;}
    
    /**/
    .overlay nav{top: 50%;}
    
    .page_tit h2{font-size: 30px;}
    
    
}

@media only screen and (max-width:390px){
    
    
}

@media only screen and (max-width:320px){
    
   
}