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

@media(max-width:1140px){
	body:not(.top) header {padding: 15px;}
    body:not(.top) header .logo{width:100px;}
	body:not(.top) header #humb{position:absolute;top:30px;right:15px;width:25px;height:25px;z-index:1000;cursor:pointer;}
	body:not(.top) header #humb .borad1{height:1px;width:25px;background:#1A1C19;position:absolute;top:4px;right:50%;transform:translateX(50%);transition:0.5s;}
	body:not(.top) header #humb .borad2{height:1px;width:25px;background:#1A1C19;position:absolute;top:50%;right:50%;transform:translate(50% ,-50%);transition:0.5s;}
	body:not(.top) header #humb .borad3{height:1px;width:25px;background:#1A1C19;position:absolute;bottom:4px;right:50%;transform:translateX(50%);transition:0.5s;}
	body:not(.top) header #humb.active .borad1{top:50%;transform:translate(50% , -50%) rotate(135deg);}
	body:not(.top) header #humb.active .borad2{width:0;}
	body:not(.top) header #humb.active .borad3{bottom:50%;transform:translate(50% , 50%) rotate(-135deg);}
	body:not(.top) header #humb.change {position:fixed;top:15px;}
	body:not(.top) header #humb.change >*{background:#1A1C19;}
	body:not(.top) header #humb.change.active >*{background:#FFF;}
	body:not(.top) header #humb {position:fixed;top:15px;}
	body:not(.top) header #humb >*{background:#1A1C19;}
	body:not(.top) header #humb.active >*{background:#FFF;}

	body:not(.top) header #humb.active + .menu{width:100%;}
	body:not(.top) header .menu{position:fixed;top:0;left:auto;right:0;background:#000;width:0;transition:0.5s;overflow:hidden;z-index:999;}
	body:not(.top) header .menuwrap{max-width:400px;height:100vh;padding:30px 20px;box-sizing:border-box;color:#FFF;background:url("../img/common/logo05.png") no-repeat;background-position:center;background-size:292px 292px;display: flex;flex-wrap: wrap;align-content: center;margin: 0 auto;}
	body:not(.top) header .menu span{display:inline-block;font-size:30px;margin-right:20px;}
	body:not(.top) header .menu a{margin-bottom:30px;font-family: 'Shippori Mincho', serif;}
	body:not(.top) header .menu a:last-child{margin-bottom:0;}
	
	.top .sec_hero .message {left:calc(50% - 10px);}
	.top .sec_concept{padding-right:20px;box-sizing:border-box;}
	.top .sec_works{padding-left:20px;padding-right:20px;box-sizing:border-box;}
	.top .sec_works .item{max-width:31%;}
	.top .sec_news{padding-left:20px;padding-right:20px;box-sizing:border-box;}
	
	.company .sec01{padding-left:20px;padding-right:20px;box-sizing:border-box;}
	.concept .sec01 .wrap01{padding-left:20px;box-sizing:border-box;}
	.concept .sec02 .wrap02{padding-right:20px;box-sizing:border-box;}
	.flow .sec01{padding-left:20px;padding-right:20px;box-sizing:border-box;}
	footer .scrolltop{top:calc(100% - 240px);}
	footer{padding-left:20px;padding-right:20px;box-sizing:border-box;}
}

@media(max-width:834px){
	.sp_only{display: block;}
	.pc_only{display: none;}
	
	body{min-width:auto;}
	header {padding: 15px;}
    header .logo{width:100px;}
	header #humb{position:absolute;top:30px;right:15px;width:25px;height:25px;z-index:1000;cursor:pointer;}
	header #humb .borad1{height:1px;width:25px;background:#FFF;position:absolute;top:4px;right:50%;transform:translateX(50%);transition:0.5s;}
	header #humb .borad2{height:1px;width:25px;background:#FFF;position:absolute;top:50%;right:50%;transform:translate(50% ,-50%);transition:0.5s;}
	header #humb .borad3{height:1px;width:25px;background:#FFF;position:absolute;bottom:4px;right:50%;transform:translateX(50%);transition:0.5s;}
	header #humb.active .borad1{top:50%;transform:translate(50% , -50%) rotate(135deg);}
	header #humb.active .borad2{width:0;}
	header #humb.active .borad3{bottom:50%;transform:translate(50% , 50%) rotate(-135deg);}
	header #humb.change {position:fixed;top:15px;}
	header #humb.change >*{background:#1A1C19;}
	header #humb.change.active >*{background:#FFF;}
	body:not(.top) header #humb {position:fixed;top:15px;}
	body:not(.top) header #humb >*{background:#1A1C19;}
	body:not(.top) header #humb.active >*{background:#FFF;}

	header #humb.active + .menu{width:100%;}
	header .menu{position:fixed;top:0;left:auto;right:0;background:#000;width:0;transition:0.5s;overflow:hidden;z-index:999;}
	header .menuwrap{max-width:400px;height:100vh;padding:30px 30px 30px 20px;box-sizing:border-box;color:#FFF;background:url("../img/common/logo05.png") no-repeat;background-position:center;background-size:292px 292px;display: flex;flex-wrap: wrap;align-content: center;margin: 0 auto;}
	header .menu span{display:inline-block;font-size:30px;margin-right:20px;}
	header .menu a{margin-bottom:30px;font-family: 'Shippori Mincho', serif;}
	header .menu a:last-child{margin-bottom:0;}

	footer{padding:30px 20px 10px;}
	footer .wrap01{justify-content:left;}
	footer .logowrap{width:100%;margin-bottom:40px;order:1;}
	footer .logowrap .logo{margin: 0 auto;}
	footer .contact{width:auto;border:none;order:3;margin: 15px auto;}
	footer .menu{width:100%;order:2;border-bottom:1px solid #3E3F3D;padding-bottom:15px;display:flex;flex-wrap:wrap;justify-content:center;}
	footer .menu a{margin:15px;}
	footer .texts{order:4;border-top:1px solid #3E3F3D;padding-top:15px;width:100%;}
	footer .texts .logo{position:static;margin: 15px auto 20px 0;}
	footer .copyright{font-size: 10px;order:5;text-align:left;}
	footer .scrolltop{top:calc(100% - 15px);right:15px;}


	.top .sec_hero{height:100vh;box-sizing:border-box;padding:100px 35px;}
	.top .sec_hero .slider .main{max-width:100%;height:calc(100vh - 200px);}
	.top .sec_hero .message{font-size:24px;line-height:40px;top:calc(100vh - 250px);left:calc(50% - 30px);}
	.top .sec_hero .slider .dots{left:35px;bottom:0;line-height:100%;}


	.top .sec_concept{flex-wrap:wrap;}
	.top .sec_concept .img{width:calc(1000% - 18px);height:auto;order:2;}
	.top .sec_concept .texts{width:100%;padding:0 20px 40px;}
	.top .sec_concept .titles{margin-bottom:40px;display:flex;}
	.top .sec_concept .etitle{font-size:30px;margin-right:10px;}
	.top .sec_concept .subtitle{font-size:22px;line-height:34px;}


	.top .sec_works{margin-top:45px;padding: 0 20px;}
	.top .sec_works .titles{display:flex;margin-bottom:20px;}
	.top .sec_works .etitle{font-size:30px;margin-bottom:0;margin-right:10px;}
	.top .sec_works .title{align-self:flex-end;padding-bottom:6px;}
	.top .sec_works .items > *{width:calc(50% - 10px);}
	.top .sec_works .item{margin-bottom:25px;max-width:100%;}
	.top .sec_works .img{height:calc((100vw - 60px) / 3);}
	.top .sec_works .link_wrap{text-align:right;}

	.top .sections{margin: 35px auto 0;flex-wrap:wrap;}
	.top .sec_company{width:100%;height:250px;}
	.top .sec_company .texts{width:calc(100% - 40px);max-width:400px;}
	.top .sec_company .titles{margin-bottom:25px;}
	.top .sec_company .text{margin-bottom:25px;}

	.top .sec_flow{width:100%;height:250px;margin-top:0px;}
	.top .sec_flow .texts{width:calc(100% - 40px);max-width:400px;}
	.top .sec_flow .titles{margin-bottom:25px;}
	.top .sec_flow .text{margin-bottom:25px;}

	.top .sec_news{padding:50px 20px;box-sizing:border-box;margin:0;}
	.top .sec_news .titles{display:flex;margin-bottom:20px;}
	.top .sec_news .etitle{font-size:30px;margin-bottom:0;margin-right:10px;}
	.top .sec_news .title{align-self:flex-end;padding-bottom:6px;}
	.top .sec_news .links{width:100%;margin-bottom:25px;}
	.top .sec_news .link{padding:25px 0;}

	.top .sec_contact{margin: 0px auto 70px;}
	.top .sec_contact .img{height:200px;object-fit:cover;}
	.top .sec_contact img{width:100%;height:100%;}
	.top .sec_contact .titles{display:flex;margin-top:0;margin-bottom:0;padding:30px 20px 0;max-width:400px;}
	.top .sec_contact .etitle{font-size:30px;margin-bottom:0;margin-right:10px;}
	.top .sec_contact .title{align-self:flex-end;padding-bottom:6px;}
	.top .sec_contact .links{flex-wrap:wrap;padding: 0 20px 30px;max-width:400px;}
	.top .sec_contact .tel{width:100%;text-align:left;margin: 30px 0 ;}
	.top .sec_contact .mail{width:100%;margin:0;}

	body:not(.top) .sec_hero{padding:10px 0 45px;}
	body:not(.top) .sec_hero .etitle{font-size:40px;}
	body:not(.top) .sec_hero .title{font-size:14px;}
	body:not(.top) .sec_hero .img{width:calc(100% - 20px);height:270px;}

	.company .sec01{padding:0 20px;box-sizing:border-box;margin: 0 auto 60px;}
	.company .sec01 dl::before{display:none;}
	.company .sec01 dt{width:100%;border-bottom:0;padding-bottom:0;}
	.company .sec01 dd{width:100%;padding-top:2px;}
	.company .sec02{padding:0 20px;box-sizing:border-box;margin: 0 auto 35px;}
	.company .sec02 iframe{width:100%;height:300px;}

	.concept .sec01{padding-bottom:0;position:relative;}
	.concept .sec01 .wrap01{padding: 0 20px;box-sizing:border-box;}
	.concept .sec01 .deco{height:230px;width:calc(100% - 75px);position:static;margin: 50px 0 0 auto;}
	.concept .sec02{padding-top:0;display:flex;flex-wrap:wrap;padding-bottom:50px;}
	.concept .sec02 .wrap01{padding: 0 20px;box-sizing:border-box;order:2;}
	.concept .sec02 .deco{height:130px;width:calc(100% - 170px);position:static;margin: 40px auto 40px 0;order:1;}
	.concept .sec03 .deco{height:200px;}
	.concept .sec03 .wrap01{padding:45px 20px;box-sizing:border-box;margin:0;}
	.concept .sec03 .logo{width:210px;top:-50px;left:20px;}

	body.works .sec_hero{padding-bottom:25px;}
	.works .sec01{padding-bottom:55px;}
	.works .sec01 .item{width:calc(50% - 10px);margin-bottom:40px;}
	.works .sec01 .item .img{height:110px;}

	body.works_det .sec_hero{padding-bottom:25px;}
	.works_det .sec01{padding:0 0 50px;}
	.works_det .sec01 .title{padding: 0 20px;box-sizing:border-box;}
	.works_det .sec01 .text{padding: 0 20px;box-sizing:border-box;}
	.works_det .sec01 .imgs{padding: 0 20px;box-sizing:border-box;}
	.works_det .sec01 .img{width:100%;height:220px;margin-bottom:20px;}


	body.news .sec_hero{padding-bottom:25px;}
	.news .sec01{padding:0 20px 45px;}
	
	body.news_det .sec_hero{padding-bottom:25px;}
	.news_det .sec01{padding:0 20px 45px;}
	.news_det .sec01 .img{width:100%;margin-bottom:45px;}

	.flow .sec01{padding-bottom:45px;}
	.flow .sec01 .steps{padding: 0 20px;}
	.flow .sec01 .step{padding-left:45px;}
	.flow .sec01 .step::before{height:calc(100% - 40px);top:50px;left:14.5px;}
	.flow .sec01 .step + .step{margin-top:30px;}
	.flow .sec01 .step .num{font-size:30px;line-height:40px;width:30px;text-align:center;}
	.flow .sec01 .step .name{font-size:18px;line-height:40px;padding:0;}
	

	body.contact .sec_hero{padding-bottom:25px;}
	.contact .secinput{padding:0 20px;}
	.contact .text{margin: 30px 0;}
	.contact .item{margin:20px 0;}
	.contact .input{width:100%;}
	.contact .output{width:100%;}
	
	.contact .text02{font-size:14px;text-align:justify;}
	
}