@charset "utf-8";
@media screen and (min-width: 769px){
	.wrapper{
		position: relative;
		overflow: hidden;
	}

	/*header
	--------------------------------------------*/
	.fixed{
		position: fixed;
		width: 100%;
		margin: 0 auto;
		left: 0;
		right: 0;
		top: 0;
		background: #fff;
		z-index: 1000;
		transition: all 0.5s ease-in-out;
	}

	.h_cont{
		padding: 10px 0;
	}

	.title{
		width: 450px;
		float: left;
	}

	.title h1{
		float: left;
	}

	.title .title_txt{
		width: 230px;
		float: right;
	}

	.title_txt{
		font-size: 16px;
		color: #b2aaaa;
		text-align: left;
		letter-spacing: 1px;
	}

	.title_txt span{
		text-align: center;
		font-size: 10px;
		display: block;
		border-top: 1px solid #e4dedd;
		letter-spacing: 0;
	}

	.head_r{
		width: 595px;
		float: right;
	}

	.sns{
		width: 95px;
		float: left;
		margin-right: 10px;
	}

	.sns li:first-child{
		float: left;
	}

	.sns li:last-child{
		float: right;
	}

	.h_tel{
		width: 245px;
		float: left;
	}

	.h_tel>dl>dt{
		font-size: 14px;
		color: #fff;
		background: #7d7a7a;
		border-radius: 11.5px;
		padding: 3px 0;
	}

	.h_tel>dl>dd>dl>dt,
	.h_tel>dl>dd>dl>dd{
		display: inline-block;
		vertical-align: middle;
		box-sizing: border-box;
	}

	.h_tel>dl>dd>dl>dt{
		font-size: 16px;
		color: #464541;
	}

	.h_tel>dl>dd>dl>dt:after{
		content: ':';
		padding:0 3px;
	}

	.h_tel>dl>dd>dl>dd{
		font-size: 25px;
	}

	.h_tel>dl>dd>dl>dd a{
		color: #464541;
	}

	.h_mail{
		width: 230px;
		float: right;
		font-size: 20px;
	}

	.h_mail a{
		color: #fff;
		background: url(../img/mail01.png) no-repeat,
					#43b8ef;
		background-position: 10% 50%;
		border-radius: 6px;
		box-shadow: 0px 7px 3px -3px #2ca2d9;
		    		-webkit-box-shadow: 0px 7px 3px -3px #2ca2d9;
		    		-moz-box-shadow: 0px 7px 3px -3px #2ca2d9;
		padding: 10px 10px 10px 25px;
		display: block;
	}

	.nav{
		padding:10px 0;
	}

	.nav li{
		width: 135px;
		float: left;
		border-left: 1px solid #ccc;
		box-sizing: border-box;
		font-size:16px;
		letter-spacing: 1px;
	}

	.nav li:last-child{
		border-right: 1px solid #ccc;
	}

	/*---------main_visual------------*/
	.main_visual {
		width:100%;
		height: 75vh;
		position: relative;
		overflow: hidden;
		text-align: center;
		background-size: cover;
		background: #000;
	}

	.main_visual video{
		position: absolute;
	    top:50%;
	    min-width: 100%;
	    min-height: 100%;
	    width: 100%;
	    height: 90vh;
	    transform: translate(-50%,-50%);
	  	-ms-transform: translate(-50%,-50%);
	}

	/*リンク
	--------------------------------------------*/
	.pagelinks{
		background: url(../img/bg.png) center no-repeat;
		background-size: cover;
		padding: 225px 0;
	}

	.pagelinks li{
		width: 50%;
	}

	.pagelinks li:first-child{
		float:left;
	}

	.pagelinks li:last-child{
		float:left;
	}

	.link_btn{
		width: 260px;
		font-size: 23px;
		font-weight: bold;
		border-radius: 6px;
	}

	.pagelinks li:first-child .link_btn{
		margin-left: auto;
		margin-right: 60px;
	}

	.pagelinks li:last-child .link_btn{
		margin-right: auto;
		margin-left: 50px;
	}

	.link_btn a{
		padding: 15px 0;
		display: block;
		color: #fff;
		border-radius: 6px;
	}

	.pagelinks li:first-child .link_btn a{
		background: url(../img/arr01.png) no-repeat,
					#55bed1;
		background-position: 90% 50%;
		box-shadow: 0px 7px 3px -3px #359db0;
		    		-webkit-box-shadow: 0px 7px 3px -3px #359db0;
		    		-moz-box-shadow: 0px 7px 3px -3px #359db0;
	}

	.pagelinks li:last-child .link_btn a{
		background: url(../img/arr01.png) no-repeat,
					#fcc800;
		background-position: 90% 50%;
		box-shadow: 0px 7px 3px -3px #dcaf00;
		    		-webkit-box-shadow: 0px 7px 3px -3px #dcaf00;
		    		-moz-box-shadow: 0px 7px 3px -3px #dcaf00;
	}

	#about,
	#works,
	#merit,
	#flow,
	#voice,
	#recruit,
	#company,
	#news{
		padding-top: 150px;
		margin-top: -150px;
	}

	/*共通
	--------------------------------------------*/
	.sec_ttl{
		font-size: 34px;
		letter-spacing: 2px;
		margin-bottom: 30px;
	}

	.sec_ttl span{
		display: block;
		font-size: 16px;
		color: #fcc800;
	}

	.cmn_btn{
		width: 235px;
		margin: 0 auto;
	}

	.cmn_btn a{
		background: #fcc800;
		box-shadow: 0px 7px 3px -3px #d1a600;
		    		-webkit-box-shadow: 0px 7px 3px -3px #d1a600;
		    		-moz-box-shadow: 0px 7px 3px -3px #d1a600;
		padding: 15px 0;
		display: block;
	}

	/*sec01
	--------------------------------------------*/
	.sec01{
		background: url(../img/img_list.png) no-repeat,
					#fef7ef;
		background-position: 50% 97%;
		padding: 35px 0 350px 0;
	}

	.sec01_cont{
		margin-bottom: 25px;
	}

	.sec01_cont li{
		width: 520px;
	}

	.sec01_cont li:first-child{
		float: left;
	}

	.sec01_cont li:last-child{
		float: right;
	}

	.sec01_cont li h4{
		color: #da683c;
		padding: 10px 0;
		font-size: 34px;
		letter-spacing: 2px;
	}

	.sec01_cont p{
		text-align: left;
		letter-spacing: 2px;
	}

	/*sec02
	--------------------------------------------*/
	.sec02{
		padding: 60px 0;
	}

	#loopslider {
      margin: 0 auto;
      width: 100%;
      height: 300px;
      position: relative;
      overflow: hidden;
    }

    .sec02_list{
    	margin-bottom: 45px;
    }

    .sec02_list .inbox{
        width: 1080px !important;
        margin: 0 auto !important;
    }

    .sec02_list .inbox li{
        margin-right:30px !important;
    }

    .sec02_list .inbox li:last-child{
        margin-right: 0 !important;
    }

    #loopslider *{
    	margin: 0;
    	padding: 0;
    }

    #loopslider ul {
        height: 300px;
        float: left;
        display: inline;
        overflow: hidden;
    }

    #loopslider ul li {
        width: 340px;
        height: 300px;
        float: left;
        margin-right: 30px;
        display: inline;
        overflow: hidden;
        position: relative;
    }

    /*#loopslider ul li:last-child{
    	margin-right: 0;
    }*/

    #loopslider ul li a{
        display: block;
    }

    #loopslider ul li .thumb{
    	width: 340px;
    	height: 240px;
    }

    #loopslider ul li .place{
    	text-align: left;
    	padding: 0 10px;
    }

    #loopslider ul:after {
        content: ".";
        height: 0;
        clear: both;
        display: block;
        visibility: hidden;
    }

    #loopslider ul {
        display: inline-block;
        overflow: hidden;
    }

	/*sec03
	--------------------------------------------*/
	.sec03{
		padding: 45px 0 25px 0;
		background: url(../img/bg_img03.png) no-repeat,
					url(../img/bg01.png) center no-repeat;
		background-position: calc(50% - 350px) 100%,
							 50% 50%;
	}

	.sec03_list{
		width: 540px;
		margin-left: auto;
	}

	.sec03_list li{
		text-align: left;
		font-size: 40px;
		color: #2468a2;
		background: url(../img/check.png) no-repeat,
					#fcc800;
		background-position: 7% 50%;
		border-radius: 55px;
		padding: 25px 25px 25px 95px;
		margin-bottom: 20px;
		letter-spacing: 2px;
	}

	.sec03_list li:last-child{
		margin-bottom: 0;
	}

	/*sec04
	--------------------------------------------*/
	.sec04{
		padding: 100px 0;
	}

	.flow_cont{
		border:1px solid #dfd3c4;
		background: #fef7ef;
		padding: 0 10px;
		margin-bottom: 25px;
	}

	.flow_cont li{
		width: 150px;
		height: 350px;
		float: left;
		margin-right: 25px;
		position: relative;
	}

	.flow_cont li:last-child{
		margin-right: 0;
	}

	.flow_cont li:after{
		background: url(../img/flow_arr.png) no-repeat;
		position: absolute;
		content: '';
		width: 18px;
		height: 100%;
		margin: 0 auto;
		right: -28px;
		top: 0;
	}

	.flow_cont li:last-child:after{
		background: none;
	}

	.flow_cont li dt{
		padding: 10px 0 10px 25px;
		font-size: 14px;
		color: #231815;
		border-bottom: 1px solid #bebebe;
		background: url(../img/icon01.png) left center no-repeat;
		text-align: left;
		margin-bottom: 30px;
	}

	.flow_cont li:first-child dt{
		background: none
	}

	.flow_cont li dd{
		-webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        -webkit-text-orientation: upright;
  		text-orientation: upright;
  		font-size: 33px;
  		text-align: left;
  		margin: 0 auto;
	}

	.caution_txt{
		line-height: 32px;
		text-align: left;
	}

	/*sec05
	--------------------------------------------*/
	.sec05{
		padding: 75px 0 90px 0;
		background: #fef7ef;
	}

	.voice_list li{
		width: 340px;
		float: left;
		margin-right: 30px;
	}

	.voice_list li:last-child{
		margin-right: 0;
	}

	.voice_list li dt{
		padding-left: 30px;
		background:url(../img/icon02.png) left center no-repeat;
		text-align: left;
		font-size: 19px;
		margin-bottom: 5px;
	}

	.voice_list li dt span{
		font-size: 13px;
	}

	.voice_list li dt span:before{
		content: '|';
		padding: 0 15px;
		color: #ece8e8;
	}

	.voice_list li dd{
		background: #fff;
		padding: 20px;
		text-align: left;
		font-size: 17px;
	}

	/*sec06
	--------------------------------------------*/
	.sec06{
		padding: 40px 0;
	}

	/*sec07
	--------------------------------------------*/
	.sec07{
		padding: 50px 0;
	}

	.company_tbl{
		margin-bottom: 45px;
	}

	.company_tbl dd a{
		color: #603626;
	}

	.bnr{
		background: url(../img/bnr_img.png) right center no-repeat,
					url(../img/block.png);
		padding: 25px 0 20px 90px;
		width: 900px;
		margin: 0 auto;
	}

	.bnr_cont{
		width: 270px;
		margin-right: auto;
	}

	.bnr_ttl{
		font-size: 33px;
		color: #eac228;
		letter-spacing: 2px;
		margin-bottom: 20px;
	}

	.bnr_tel{
		margin-bottom:5px;
	}

	.bnr_tel>dl>dt{
		font-size: 14px;
		color: #fff;
		background: #7d7a7a;
		border-radius: 11.5px;
		padding: 3px 0;
	}

	.bnr_tel>dl>dd>dl>dt,
	.bnr_tel>dl>dd>dl>dd{
		display: inline-block;
		vertical-align: middle;
		box-sizing: border-box;
	}

	.bnr_tel>dl>dd>dl>dt{
		font-size: 16px;
		color: #464541;
	}

	.bnr_tel>dl>dd>dl>dt:after{
		content: ':';
		padding:0 3px;
	}

	.bnr_tel>dl>dd>dl>dd{
		font-size: 25px;
	}

	.bnr_tel>dl>dd>dl>dd a{
		color: #464541;
	}

	.bnr_mail{
		font-size: 20px;
	}

	.bnr_mail a{
		color: #fff;
		background: url(../img/mail01.png) no-repeat,
					#43b8ef;
		background-position: 10% 50%;
		border-radius: 6px;
		box-shadow: 0px 7px 3px -3px #2ca2d9;
		    		-webkit-box-shadow: 0px 7px 3px -3px #2ca2d9;
		    		-moz-box-shadow: 0px 7px 3px -3px #2ca2d9;
		padding: 10px 10px 10px 25px;
		display: block;
	}

	/*sec08
	--------------------------------------------*/
	.sec08{
		padding: 90px 0;
		background: #fef7ef;
	}

	.sec08_cont .sec08_block{
		width: 520px;
	}

	.sec08_cont .sec08_block:first-child{
		float: left;
	}

	.sec08_cont .sec08_block:last-child{
		float: right;
	}

	.sec08_ttl h3{
		font-size: 34px;
		float: left;
	}

	.sec08_ttl h3 span{
		font-size: 16px;
		color: #fcc800;
		margin-left: 5px;
	}

	.more_btn{
		width: 110px;
		font-size: 15px;
		padding-top: 10px;
	}

	.sec08_ttl .more_btn{
		float: right;
	}

	.more_btn a{
		color: #fff;
		background: #7abd69;
		padding: 5px 0;
		display: block;
		border-radius: 4px;
	}

	.more_btn a span:after{
		content: '\02192';
		padding-left: 5px;
	}

	.post_list{
		background: #fff;
		padding: 20px 15px 35px 15px;
	}

	.post_list li{
		text-align: left;
		border-bottom: 1px solid #e3e3e3;
	}

	.post_list li a{
		padding: 20px 0 10px 0;
		display: block;
		color: #603626;
	}

	.post_list li a time{
		display: block;
		font-size: 14px;
		letter-spacing: 2px;
	}

	/*下層共通
	--------------------------------------------*/
	.bt_main{
		background: url(../img/mv.png) center no-repeat;
		position: relative;
		height: 370px;
	}

	.bt_ttl{
		color: #fff;
		font-size: 34px;
		position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 999;
        text-shadow: 0 0 8px #584a39;
        letter-spacing: 2px;
	}

	.cmn_cont{
		padding: 100px 0;
	}

	.sub_ttl{
		font-size: 34px;
		text-align: center;
		margin-bottom: 30px;
		padding-bottom: 5px;
		letter-spacing: 2px;
		background: url(../img/sub_border.png) bottom center no-repeat;
	}

	/*施工事例
	--------------------------------------------*/
	.works_list{
		margin-bottom: 10px;
	}

	.works_list li{
		width: 340px;
		margin-right: 30px;
		float: left;
		margin-bottom: 30px;
	}

	.works_list li:nth-child(3n){
		margin-right: 0;
	}

	.works_list li:nth-child(3n+1):nth-last-child(-n+3),
	.works_list li:nth-child(3n+1):nth-last-child(-n+3) ~ li{
	    margin-bottom:0;
	}

	.works_list li a{
		display: block;
	}

	.works_list li .thumb{
		width: 340px;
		height: 280px;
		margin-bottom: 10px;
	}

	.works_list li .place{
		text-align: left;
	}

	/*----------詳細---------*/
	.img_area{
		margin-bottom: 45px;
	}

	.main_img{
		margin-bottom: 45px;
	}

	.main_img img{
		max-width: 100%;
		height: auto;
	}

	.img_list li{
		width: 212px;
		height: 120px;
		float: left;
		margin-right: 5px;
		margin-bottom: 5px;
	}

	.img_list li:nth-child(5n){
		margin-right: 0;
	}

	.img_list li:nth-child(5n+1):nth-last-child(-n+5),
	.img_list li:nth-child(5n+1):nth-last-child(-n+5) ~ li{
		margin-bottom: 0;
	}

	.works .post_body{
		text-align: left;
		margin-bottom: 15px;
	}

	/*新着情報・コラム
	--------------------------------------------*/
	.news_list{
		margin-bottom: 10px;
	}

	.news_list li{
		padding: 25px 30px;
		border-radius: 5px;
		margin-bottom: 30px;
		text-align: left;
		border:1px solid #ccc;
	}

	.news_list li:last-child{
		margin-bottom: 0;
	}

	.news_list li time{
		color: #7abd69;
		margin-right: 15px;
		font-size: 14px;
	}

	.post-head{
		border-bottom: 1px solid #7abd69;
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	.news .news_list li .post-ttl{
		font-size: 22px;
	}

	.news .news_list li .post-body{
		display: block;
	}

	.news .more_btn{
		width: 180px;
		margin-left:auto;
		text-align: center;
	}

	/*------------詳細------------*/
	.news_body{
		border:1px solid #ccc;
		padding:20px;
		text-align: left;
		margin-bottom: 10px;
	}

	.news_body time{
		text-align: right;
		margin-top: 20px;
		color: #7abd69;
		font-size: 14px;
		display: block;
	}

	/*foooter
	--------------------------------------------*/
	.footer{
		font-size: 12px;
		background: #fcc800;
		padding: 15px 0;
	}

	.copyright a{
		color: #603626;
	}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){
	.main_visual {
		width:100%;
		height: 80vh;
		position: relative;
		overflow: hidden;
		text-align: center;
		background-size: cover;
		background: #000;
	}

	.main_visual video{
		position: absolute;
	    min-width: 100%;
	    min-height: 100%;
	    width: 100%;
	    height: 85vh;
	    top: 0;
	    transform:none !important;
	    -ms-transform:none !important;
	}

	.flow_cont li dd{
		width: auto;
		padding: 0 40px;
	}
}