@charset "utf-8";
/* Body
------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
html{
	overflow-x: hidden!important;
	font-size: 62.5%;
}
body {
	box-shadow: none;
	color: #000;
	font-family: YakuHanJP,"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN",
				 "Hiragino Sans", "ヒラギノ角ゴシック", source-han-sans-japanese,
				 "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium",
				 "游ゴシック", "Yu Gothic", "メイリオ", Meiryo,
				 "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 1.6em;
	font-weight: 300;
	line-height: 1.88;
	letter-spacing: .025em;
	-webkit-text-size-adjust: 100%!important;
	top: 0!important;
	margin: 0;
	overflow-x: hidden;
}
@keyframes fadeIn {
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@-webkit-keyframes fadeIn {
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
a{
	text-decoration: none;
	transition: .25s;
	color: inherit;
}
img{
	vertical-align: top;
	max-width: 100%;
	height: auto;
}
.en{
	font-family: 'Bebas Neue', cursive;
}

/* layout
------------------------------ */
.wrapper{
	position: relative;
	display: block;
	clear: both;
	float: none;
	width: 1250px;
	margin: 0 auto;
	padding: 0 15px;
}
ul,ol{
	letter-spacing: -.4em;
	line-height: 0;
}
li{
	list-style: none;
	letter-spacing: normal;
	line-height: 1.5;
	vertical-align: middle;
}
p{
	margin: 0;
}
.fw_6{
	font-weight: 600;
}

/* Common
------------------------------ */
* {
	min-height: 0;
	min-width : 0;
}
.fl_l{
	display: inline;
	float: left;
}
.fl_r{
	display: inline;
	float: right;
}
.float::before,
.float::after{
	content: " ";
	display: block;
	clear: both;
}
.btn{
	position: relative;
	display: inline-block;
	width: 272px;
	height: 70px;
	color: #FFF;
	font-size: 1.6rem;
	font-weight: 600;
	text-align: left;
	line-height: 73px;
	letter-spacing: .05em;
	vertical-align: middle;
	margin-right: 35px;
	padding-left: 30px;
	background: #009e75;
	box-sizing: border-box;
}
.btn:last-child,
.btn:last-of-type{
	margin-right: 0;
}
.btn .arrow{
	position: absolute;
	display: block;
	width: 24px;
	height: 1px;
	background: #FFF;
	top: 0;
	right: 26px;
	bottom: 0;
	margin: auto 0;
	transition: .35s;
}
.btn .arrow::before,.btn .arrow::after{
	content: "";
	position: absolute;
	display: block;
	width: 7px;
	height: 1px;
	background: #FFF;
	right: -1px;
	transition: .35s;
}
.btn .arrow::before{
	top: -2px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
.btn .arrow::after{
	bottom: -2px;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
.btn:hover{
	color: #009e75;
	background: #c1e8d8;
	border-radius: 0;
}
.btn:hover .arrow{
	width: 29px;
	right: 21px;
	background: #009e75;
}
.btn:hover .arrow::before,
.btn:hover .arrow::after{
	right: -3px;
	background: #009e75;
}
.btn.contact::before{
	content: "";
	position: relative;
	display: inline-block;
	width: 27px;
	height: 20px;
	background: url(../images/icon_mailW.svg) no-repeat center center;
	background-size: contain;
	vertical-align: middle;
	margin-right: 20px;
	top: -2.5px;
	transition: .35s;
}
.btn.contact:hover::before{
	background-image: url(../images/icon_mailG.svg);
}
.pict img,figure img{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
.text_link {
	display: inline-block;
	text-decoration: none;
	color: #000;
}
.text_link::after {
	content: "";
	display: block;
	width: 0;
	transition: width 0.3s;
	border-bottom: 1px solid #000;
	margin: -6px auto 0;
	border-radius: 1px;
}
.text_link:hover{
	text-decoration: none;
}
.text_link:hover::after {
	width: 100%;
}
.emphasis{
	color: #FF0000;
}
.caution{
	position: relative;
	display: inline-block;
	font-size: 1.6rem;
	padding-left: 1em;
	text-indent: -1em;
}
.caution::before{
	content: "※";
}
figure{
	margin: 0;
}
.flex{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.tel{
	position: relative;
	display: block;
	width: 308px;
	height: 30px;
	font-size: 0;
	background: url(../images/tel.svg) no-repeat center center;
	background-size: contain;
}
.mb_20{
	content: "";
    display: block;
	margin-bottom: 20px;
}

/* Header
------------------------------ */
header{
	position: fixed;
	display: block;
	width: 100%;
	height: 100px;
	z-index: 3;
	background: #FFF;
	top: 0;
    box-shadow: 5px 5px 5px rgb(112 112 112 / 50%);
}
.customize-support header{
	top: 32px;
}
a.logo{
	position: relative;
	display: block;
	width: 403px;
	height: 61px;
	font-size: 0;
	background: url(../images/logo.svg) no-repeat center center;
	background-size: contain;
	margin-top: 20px;
}
a.logo:hover{
	opacity: .7;
}
#gnav{
	position: absolute;
	display: block;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto 0;
}
#gnav ul{
	align-items: center;
}
#gnav ul li{
	margin-right: 2rem;
}
#gnav ul li:nth-last-child(2){
	margin-right: 33px;
}
#gnav ul li:last-child{
	margin-right: 0;
}
#gnav ul li a{
	color: #000;
	letter-spacing: .05em;
	padding-bottom: 42px;
}
#gnav ul li a:hover{
	color: #009e75;
}
#gnav ul li.contact a{
	position: relative;
	display: block;
	width: 185px;
	height: 100px;
	color: #FFF;
	line-height: 1;
	text-align: center;
	padding-top: 27px;
	box-sizing: border-box;
	background: #009e75;
}
#gnav ul li.contact a::before{
	content: "";
	position: relative;
	display: block;
	width: 27px;
	height: 20px;
	background: url(../images/icon_mailW.svg) no-repeat center center;
	background-size: contain;
	margin: 0 auto 12px;
	transition: .35s;
}
#gnav ul li.contact a:hover{
	color: #009E75;
	background: #c1e8d8;
}
#gnav ul li.contact a:hover::before{
	background-image: url(../images/icon_mailG.svg);
}
/* 子メニュー */
#gnav ul li .sub{
	position: absolute;
	display: none;
	height: auto;
	letter-spacing: -.4em;
	box-sizing: border-box;
	top: 82px;
	z-index: 10;
}
#gnav ul li ul li{
	display: block;
	width: 100%;
	height: auto;
	line-height: 1;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	border-top: 1px solid rgba(255,255,255,.5);
}
#gnav ul li ul li:first-child{
	border-top: 0;
}
#gnav ul li .sub li:first-child::before,
#gnav ul li .sub li::after{
	display: none;
}
#gnav ul li .sub li a{
	position: relative;
	display: block;
	color: #009e75;
	width: 100%;
	height: auto;
	font-size: 1.4rem;
	font-weight: 600;
	text-align: left;
	line-height: 1.5;
	letter-spacing: 0;
	padding: 14px 10px 12px;
	border-left: 0;
	background: #E7F7EF;
	box-sizing: border-box;
}
#gnav ul li .sub li:last-child a,
#gnav ul li:last-child .sub li a{
	border-right: 0;
}
#gnav ul li .sub li a:hover{
	color: #000;
	background: #E7F7EF;
}
#gnav ul li .sub li a::after{
	display: none;
}
/* //子メニュー */

/* index
------------------------------ */
#slider{
	height: 550px;
	margin-top: 100px;
}
#slider .swiper-slide{
	height: 550px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.slide01{
	background-image: url(../images/slider01_bg.jpg);
}
.slide02{
	background-image: url(../images/slider02_bg.jpg);
}
.slide03{
	background-image: url(../images/slider03_bg.jpg);
}
.slide04{
	background-image: url(../images/slider04_bg.jpg);
}
.swiper-slide p{
	position: relative;
	display: block;
	max-width: 680px;
	width: 100%;
	font-size: 5rem;
	line-height: 1;
	/*letter-spacing: .01em;*/
	letter-spacing: -.01em;
	margin-top: 100px;
	padding: 28px 0 27px 24px;
	background: #FFF;
	box-sizing: border-box;
}
.swiper-slide p span.en{
	position: relative;
	display: block;
	color: #009e75;
	font-size: 2.3rem;
	line-height: 1;
	letter-spacing: .05em;
	margin: 0 0 8px 11px;
}
.swiper-slide p::before,
.swiper-slide p::after{
	content: "";
	position: absolute;
	display: block;
}
.swiper-slide p::before{
	width: 10px;
	height: 81px;
	background: #009e75;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto 0;
}
.swiper-slide p::after{
	width: 100%;
	height: 136px;
	background: #FFF;
	top: 0;
	left: -100%;
}

#index section h2,.css_h2{
	font-size: 2.6rem;
	line-height: 1;
	text-align: center;
	letter-spacing: .3em;
}
#index section h2 span.en,
.sub #bottom_contact h2 span.en,
.css_h2 span.en{
	display: inline-block;
	color: #009e75;
	font-size: 2.3rem;
	line-height: 1;
	letter-spacing: .05em;
	margin-bottom: 34px;
	padding-bottom: 6px;
	border-bottom: 2px solid #000;
}
#index section h2 span.ja,
.css_h2 span.ja{
	display: block;
}
section h2.band{
	position: relative;
	display: block;
	width: 100%;
	height: 200px;
	padding: 50px 0 54px;
	background: #85cfb2;
	box-sizing: border-box;
}
#index section h2.band{
	font-size: 2.6rem;
}
.index section p.center{
	text-align: center;
}

/* index01 */
#index01{
	font-size: 0;
	text-align: center;
	padding: 90px 0 110px;
}
#index #index01 h2{
	color: #009e75;
	font-size: 3.6rem;
	line-height: 1.56;
	letter-spacing: .05em;
	margin-bottom: 35px;
}
#index #index01 h2 span.en{
	margin-bottom: 40px;
}
#index01 p{
	font-size: 1.6rem;
}
#index01 ul.flex{
	max-width: 940px;
	width: 100%;
	margin: 40px auto 55px;
}
#index01 ul.flex li{
	width: 158px;
	height: 158px;
	font-size: 2.2rem;
	letter-spacing: .05em;
	line-height: 158px;
	border-radius: 50%;
	background: #c1e8d8;
}
#index01 ul.flex li:nth-child(2n){
	background: #85cfb2;
}
/* //index01 */
/* index02 */
#index02 .box{
	position: relative;
	display: block;
	width: 100%;
	height: 500px;
	background: #c1e8d8;
}
#index02 .box::before{
	content: "";
	position: absolute;
	display: block;
	width: 50%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	top: 0;
	bottom: 0;
}
#index02 .box.left_pic::before{
	left: 0;
}
#index02 #yess::before{
	background-image: url(../images/index02_main1.jpg);
}
#index02 #build::before{
	background-image: url(../images/index02_main2.jpg);
}
#index02 .box.left_pic .wrapper{
	width: 555px;
	padding: 110px 15px 112px 680px;
}
#index02 .box h3{
	color: #009e75;
	font-size: 3.6rem;
	line-height: 1;
	margin-bottom: 25px;
}
#index02 .box p{
	line-height: 1.75;
	margin-bottom: 35px;
}
#index02 .box a.btn:hover{
	background: #FFF;
}
#index02 .list{
	position: relative;
	display: block;
}
#index02 .list::after{
	content: "";
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	background: #f1f1f1;
	top: 0;
	left: -70%;
	z-index: -1;
}
#index02 .list .wrapper{
	align-items: center;
	background: url(../images/box_bg.jpg) no-repeat center left 15px;
	background-size: 625px auto;
	padding: 104px 15px 44px;
}
#index02 .list h4{
	margin-bottom: 35px;
}
#index02 .list a.btn{
	display: block;
	width: 196px;
	height: 50px;
	line-height: 53px;
	margin: 0 auto;
}
#index02 .wrapper .flex a img{
	height: 70px;
}
#index02 .wrapper .flex a img:hover{
	opacity: .7;
	transition: .25s;
}
#index02 .wrapper p.caution{
	display: block;
	margin-top: 5px;
	font-size: 1.4rem;
	text-align: right;
}
.works_list{
	max-width: 953px;
	width: 100%;
	padding-bottom: 30px;
}
.works_list li{
	padding: 0 9px;
	box-sizing: border-box;
}
.works_list li a{
	position: relative;
	display: block;
	max-width: 300px;
	width: 100%;
	height: auto;
	margin: 0 auto 15px;
}
.works_list li a:hover{
	opacity: .7;
}
.works_list li h5{
	font-size: 1.8rem;
	line-height: 1.3;
	letter-spacing: .05em;
	margin-bottom: 15px;
}
.works_list li p{
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: .03em;
}
.works_list li p span{
	position: relative;
	display: inline-block;
	color: #009E75;
}
.works_list li p span::before{
	content: " ｜ ";
}
.works_list .slick-prev,
.works_list .slick-next{
	width: 17px;
	height: 17px;
	border-top: 2px solid #009E75;
	border-right: 2px solid #009E75;
	-webkit-transform: rotate(-135deg);
	transform: rotate(-135deg);
	top: auto;
	left: 10px;
	bottom: 0;
	padding: 0;
	transition: .35s;
	background-color: transparent;
}
.works_list .slick-next{
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	left: auto;
	right: 10px;
}
.works_list .slick-prev:hover{
	opacity: .7;
	left: 5px;
}
.works_list .slick-next:hover{
	opacity: .7;
	right: 5px;
}
/* //index02 */
/* index03 */
#index03 .contents{
	position: relative;
	display: block;
	background: url(../images/index03_bg.jpg) no-repeat top center;
	background-size: cover;
	padding: 70px 0 90px;
}
#index03 a.btn{
	margin-top: 55px;
}
/* //index03 */
/* index04 */
#index04{
	position: relative;
	display: block;
	padding: 114px 0 126px;
}
#index04::after{
	content: "";
	position: absolute;
	display: block;
	width: 100%;
	height: 325px;
	background: #c1e8d8;
	top: 114px;
	left: -80%;
	z-index: -1;
}
#index04 .wrapper div{
	width: 250px;
	padding: 67px 54px 72px 0;
	background: #c1e8d8;
	box-sizing: border-box;
}
#index #index04 h2{
	margin-bottom: 40px;
}
#index04 .wrapper div a.btn{
	width: 196px;
	height: 50px;
	line-height: 53px;
}
#index04 .wrapper div a.btn:hover{
	background: #FFF;
}
#index04 ol{
	max-width: 950px;
	width: 100%;
}
#index04 ol li{
	letter-spacing: .05em;
	padding: 28px 0;
	border-bottom: .5px solid #009e75;
}
#index04 ol li .date{
	font-size: 1.4rem;
	line-height: 1;
	margin-right: 47px;
}
#index04 ol li a::after{
	margin-top: 0;
}
/* //index04 */

/* sub
------------------------------ */
.main_title{
	position: relative;
	display: block;
	width: 100%;
	height: 320px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	margin-top: 100px;
}
.main_title .flex{
	height: 320px;
	align-items: center;
	justify-content: center;
}
.main_title .flex div{
	display: inline-block;
	max-width: 350px;
	width: 100%;
	height: 120px;
	background: rgba(255,255,255,.9);
}
.main_title .sub_h1{
	font-size: 3.6rem;
	text-align: center;
	line-height: 1;
	letter-spacing: .12em;
}
.main_title .sub_h1 .en{
	position: relative;
	display: inline-block;
	color: #009E75;
	font-weight: 600;
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border-bottom: 2px solid #000;
	padding-bottom: 5px;
	margin-bottom: 20px;
}
.main_title .sub_h1 .ja{
	display: block;
}
.sub_section{
	padding-top: 120px;
}
.sub_section:first-of-type{
	padding-top: 0;
}
.sub_section h2,
.sub_section .css_h2{
	position: relative;
	display: block;
	font-size: 3.2rem;
	line-height: 1;
	/*letter-spacing: .1em;*/
	letter-spacing: .05em;
	text-align: left;
	margin-bottom: 60px;
	padding: 14px 0 14px 20px;
}
.sub_section h2::before,
.sub_section .css_h2::before{
	content: "";
	position: absolute;
	display: block;
	width: 7px;
	height: 100%;
	background: #009E75;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto 0;
}
.sub_section h3{
	color: #009E75;
	font-size: 2.6rem;
	line-height: 1.5;
	letter-spacing: .04em;
	margin-bottom: 30px;
}
.sub_section .flex_temp{
	display: flex;
	align-items: flex-start;
}
.sub_section .flex_temp.right_pic{
	flex-flow: row-reverse;
	justify-content: space-between;
}
.sub_section .flex_temp div{
	max-width: 700px;
	width: 100%;
}
.sub_section .flex_temp img{
	max-width: 500px;
	width: 100%;
}
.sub_section table{
	width: 100%;
}
.sub_section table.lay1{
	border-bottom: 1px solid #009E75;
}
.sub_section table tr th{
	text-align: left;
	padding: 30px;
	border-top: 1px solid #009E75;
}
.sub_section table tr td{
	padding: 30px;
	border-top: 1px solid #009E75;
}
.sub_section table.lay1 tr th{
	padding: 30px;
	background: rgba(0,158,117,.1);
}
.sub_section table.lay2 tr th{
	color: #009E75;
}
.sub_section table.lay2 tr td{
	border-color: #009E75;
}
.sub_section .tel_box{
	display: inline-block;
	max-width: 470px;
	width: 100%;
	height: 170px;
	text-align: center;
	margin: 30px 0;
	padding-top: 50px;
	box-sizing: border-box;
	background: #F1F1F1;
}
.sub_section .tel_box p{
	line-height: 1.3;
}
.sub_section .tel_box .tel{
	width: 334px;
	height: 40px;
	margin: 0 auto 15px;
	background-image: url(../images/telG.svg);
}

/* business
------------------------------ */
#business .main_title{
	background-image: url(../images/maintitle_business.jpg);
	background-position: center top;
}
#business .catchcopy{
	display: block;
	background: #009e75;
	width: 780px;
	padding: 40px 100px;
	margin: 0 auto;
	font-size: 2.6rem;
	color: #fff;
	text-align: center;
	margin-bottom: 100px;
}
#business .left_pic{
	justify-content: space-between;
}
#business .left_pic img,#yess .left_pic img,#build .left_pic img{
	margin-right: 50px;
}
#business .left_pic a.btn{
	margin: 65px 0 0 auto;
    display: block;
}
#business .business01_yess,#business .business01_build{
	margin-top: 80px;
}
#business .business01_yess img,#business .business01_build img,
#yess #yess03 img,#build #build02 img{
	margin-top: 60px;
	max-width: 400px;
}
#business .business01_yess a.btn,#business .business01_build a.btn,
#yess #yess03 a.btn,#build #build02 a.btn{
	margin: 60px auto 0;
    display: block;
}

/* business - yess -
------------------------------ */
#yess .main_title{
	background-image: url(../images/maintitle_yess.jpg);
	background-position: center top;
}
#yess #yess01 .left_pic div img{
	margin:  20px 0 0 0;
}
#yess #yess01 .merit{
	margin-top: 80px;
}
#yess #yess01 .merit ul{
	display: inline-block;
	margin-top: 60px;
}
#yess #yess01 .merit ul li{
	width: 620px;
	display: inline-block;
	margin-bottom: 40px;
}
#yess #yess01 .merit ul li h4{
	font-size: 2.6rem;
    color: #fff;
    background: #009e75;
    width: 180px;
    height: 80px;
    text-align: center;
    line-height: 80px;
    display: inline-block;
    margin-right: 30px;
    letter-spacing: .1em;
}
#yess #yess01 .merit ul li p{
	display: inline-block;
	width: 350px;
	vertical-align: top;
	line-height: 1.8;
}
#yess #yess02 ul.flex{
	justify-content: flex-start;
}
#yess #yess02 ul li{
	background: #c1e8d8;
	width: 180px;
	height: 180px;
	position: relative;
	margin: 0 28px 28px 0;
}
#yess #yess02 ul li::after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid #009e75;
	right: -16px;
	bottom: 70px;
}
#yess #yess02 ul:last-child li:last-of-type::after{
	display: none;
}
#yess #yess02 ul:last-child li{
	margin-bottom: 0;
}
#yess #yess02 ul li h4{
	font-size: 2.6rem;
	text-align: center;
	padding-top: 36px;
}
#yess #yess02 ul li p{
	display: flex;
	height: 105px;
	align-items: center;
}
#yess #yess02 ul li p span{
	margin: 0 auto;
	text-align: center;
}
#yess #yess02 .flow .flex{
	background: #f1f1f1;
	margin-top: 50px;
	padding: 40px;
	justify-content: flex-start;
	position: relative;
}
#yess #yess02 .flow .flex:first-of-type{
	margin-top: 60px;
}
#yess #yess02 .flow .flex::after{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-right: 16px solid transparent;
	border-left: 16px solid transparent;
	border-top: 16px solid #009e75;
	bottom: -16px;
	left: 50%;
}
#yess #yess02 .flow .flex:last-of-type::after{
	display: none;
}
#yess #yess02 .flow .flex h4{
	font-size: 2.6rem;
	color: #009e75;
	padding-top: 8px;
	width: 373px;
}
#yess #yess02 .flow .flex p{
	width: 803px;
}

/* business - build -
------------------------------ */
#build .main_title{
	background-image: url(../images/maintitle_build.jpg);
	background-position: center top;
}
#build #build01 .flex_temp{
	margin-top: 80px;
}

/* company
------------------------------ */
#company .main_title{
	background-image: url(../images/maintitle_company.jpg);
	background-position: center top;
}
#company-test .main_title{
	background-image: url(../images/maintitle_company.jpg);
	background-position: center top;
}
#company #company01 p.name{
	text-align: right;
    /* margin-top: 65px; */
}
#company #company01 p.name span{
	font-size: 2.4rem;
}
.company01_name {
	text-align: right;
    margin-top: 65px;
}
.company01_name p.name span{
	font-size: 2.4rem;
}
#company #company02 ul li{
	font-size: 1.8rem;
	margin-bottom: 10px;
}
#company #company02 ul li.circle{
    position: relative;
    display: block;
    padding-left: 1em;
    text-indent: -1em;
}
#company #company02 ul li.circle::before {
    content: "●";
    color: #009e75;
}
#company #company03 table.lay1 tr th{
	color: #009e75;
}
#company #company03 iframe{
	margin-top: 50px;
}
#company #company04 table.lay2 tr th{
	width: 26%;
}
#company #company04 table.lay2 tr:first-of-type th,
#company #company04 table.lay2 tr:first-of-type td{
	border:  none;
}
#company #company04 table.lay2 tr:last-of-type th{
	border-bottom: 1px solid #009E75;
}
#company #company04 table.lay2 tr:last-of-type td{
	border-bottom: 1px solid #009E75;
}
/* recruit
------------------------------ */
#recruit .main_title{
	background-image: url(../images/maintitle_recruit.jpg);
	background-position: center top;
}
#recruit02 ul li{
	max-width: 392px;
	width: 100%;
}
#recruit02 ul li h3{
	color: #000;
	font-size: 2rem;
	text-align: center;
	margin: 30px 0;
}
#recruit02 ul li span{
	line-height: 1.75;
}
#recruit03 .box{
	position: relative;
	display: block;
	border: 1px solid #009E75;
	margin: 40px auto 0;
	padding: 30px;
}
#recruit03 .box h3{
	color: #000;
	font-size: 2rem;
	margin-bottom: 40px;
}
#recruit03 .box dl dt{
	color: #009E75;
	font-size: 2rem;
	font-weight: 600;
	line-height: 1;
	margin-bottom: 13px;
}
#recruit03 .box dl dd{
	line-height: 1;
	letter-spacing: .03em;
	margin-bottom: 40px;
}
#recruit03 .box dl dd:last-child{
	margin-bottom: 0;
}
#recruit05 form#mailformpro{
	padding-bottom: 0;
}
#recruit05 table.lay2 tr th.top{
	vertical-align: top;
}
#recruit05 table.lay2 tr th span{
	color: #FF0000;
	margin-left: 8px;
}
#recruit05 table.lay2 tr td ul li{
	display: inline-block;
	vertical-align: middle;
	margin-right: 20px;
}
#recruit05 table.lay2 tr td ul li input[type="radio"]{
	margin-top: -4.5px;
}
#recruit05 table.lay2 tr td input[type="text"],
#recruit05 table.lay2 tr td input[type="tel"],
#recruit05 table.lay2 tr td input[type="email"]{
	width: 520px;
	height: 40px;
	font-size: 1.6rem;
	border: 0;
	padding: 0 5px;
	background: #F1F1F1;
	box-sizing: border-box;
}
#recruit05 table.lay2 tr td input[type="date"]{
	width: 280px;
	height: 40px;
	font-size: 1.6rem;
	text-align: left!important;
	border: 0;
	padding: 0 5px;
	background: #F1F1F1;
	box-sizing: border-box;
}
#recruit05 table.lay2 tr td .postal_code input[type="text"]{
	width: 272px;
	margin-bottom: 10px;
}
#recruit05 table.lay2 tr td .postal_code{
	display: block;
}
#recruit05 table.lay2 tr td textarea{
	max-width: 520px;
	width: 100%!important;
	min-height: 80px;
	border: 0;
	padding: 5px;
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: .05em;
	background: #F1F1F1;
	box-sizing: border-box;
}
#recruit05 table.lay2 tr:last-of-type th{
	border-bottom: 1px solid #009E75;
}
#recruit05 table.lay2 tr:last-of-type td{
	border-bottom: 1px solid #E0E0E0;
}
#recruit05 table.lay2 tr:last-of-type td textarea{
	min-height: 240px;
}
#recruit05 #privacy_policy{
	position: relative;
	display: block;
	width: 100%;
	height: 200px;
	overflow: scroll;
	margin-top: 60px;
	padding: 30px;
	background: rgba(0,158,117,.1);
	box-sizing: border-box;
}
#recruit05 #privacy_policy h3{
	font-size: 3rem;
	margin-bottom: 18px;
}
#recruit05 #privacy_policy p.mt_10{
	position: relative;
	display: block;
	margin-top: 1rem;
}
#recruit05 button{
	position: relative;
	display: block;
	width: 272px;
	height: 70px;
	border: 0;
	margin: 60px auto 0;
	box-shadow: none;
	cursor: pointer;
	transition: .35s;
}

/* recruit - thanks
------------------------------ */
#thanks .main_title{
	background-image: url(../images/maintitle_recruit.jpg);
	background-position: center top;
}
#thanks .main_title .flex div{
	max-width: 750px;
}
#thanks .sub_section{
	text-align: center;
}
#thanks .btn{
	display: block;
	margin: 60px auto 0;
}

/* works - archive
------------------------------ */
#works .main_title{
	background-image: url(../images/maintitle_works.jpg);
	background-position: center top;
}
#works .works_list_box{
	padding-top: 140px;
	margin-top: -90px;
}
#works #works_yess{
	margin-top: -140px;
}
#works .archive ul.flex{
	flex-wrap: wrap;
}
#works .archive ul.flex::after{
	content: "";
	display: block;
	max-width: 400px;
	width: 100%;
}
#works .archive ul.flex li{
	max-width: 400px;
	width: 100%;
	margin-bottom: 30px;
}
#works .archive ul.flex li a{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
#works .archive ul.flex li a:hover{
	opacity: .7;
}
#works .archive ul.flex li h3{
	margin: 15px 0 12px;
}
#works .archive ul.flex li h3 a{
	display: inline-block;
	color: #000;
	font-size: 1.8rem;
}
#works .archive ul.flex li div.flex{
	justify-content: flex-start;
}
#works .archive ul.flex li div.flex span{
	position: relative;
	font-size: 1.4rem;
	line-height: 1;
}
#works .archive ul.flex li div.flex span::after{
	content: "｜";
	color: #009e75;
	margin: 0 5px;
}
#works .archive ul.flex li div.flex span:last-child::after{
	display: none;
}
#works .archive ul.none li{
	display: block;
	text-align: center;
}

/* works - single
------------------------------ */
#works .single div.flex{
	align-items: flex-end;
	justify-content: flex-start;
	margin-bottom: 60px;
}
#works .single .inner{
	display: inline-block;
	min-width: 400px;
	padding: 30px 0 29px 35px;
	box-sizing: border-box;
	background: #f1f1f1;
}
#works .single .inner p{
	line-height: 1.75;
}
#works .single .designer{
	max-width: 400px;
	width: 100%;
	margin-left: 25px;
}
#works .single .designer .logo{
	position: relative;
	display: block;
	margin-top: 8px;
}
#works .single .designer .logo img{
	border: .5px solid #000;
}
#works .single .works_pict{
	justify-content: flex-start;
	flex-wrap: wrap;
}
.works_pict li{
	max-width: 400px;
	width: 100%;
	margin: 0 25px 40px 0;
}
.works_pict li:nth-of-type(3n){
	margin-right: 0;
}
.works_pict li span{
	display: block;
	font-size: 2rem;
	line-height: 1;
	text-align: center;
	margin-top: 25px;
}
#works .single a.btn{
	display: block;
	margin: 80px auto 0;
}

/* news - archive
------------------------------ */
#news .main_title{
	background-image: url(../images/maintitle_news.jpg);
	background-position: center top;
}
#news article.fl_l{
	width: 900px;
}
#news .archive ol li{
	position: relative;
	margin-bottom: 30px;
	padding: 40px 50px 20px;
	border: 1px solid #009E75;
}
#news .archive ol li:last-child{
	margin-bottom: 0;
}
#news .archive ol li div{
	min-width: 570px;
	width: 100%;
	text-align: right;
}
#news .archive ol li div.flex,
#news .single div.flex{
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 20px;
}
#news .archive ol li div.flex p.date,
#news .single div.flex p.date{
	line-height: 1;
	color: #009e75;
}
#news .archive ol li div.flex p.tag,
#news .single div.flex p.tag{
	position: relative;
	display: block;
	min-width: 104px;
	width: auto;
	height: 23px;
	font-size: 1.4rem;
	text-align: center;
	line-height: 23px;
	margin-left: 30px;
	background: #009E75;
	color: #fff;
}
#news .archive ol li div.flex p.cat_recruit,
#news .single div.flex p.cat_recruit{
	background: #71C5D3;
}
#news .archive ol li div.flex p.blog,
#news .single div.flex p.blog{
	background: #0086AE;
}
#news .archive ol li h3.title{
	margin-bottom: 15px;
}
#news .archive ol li div.excerpt{
	min-width: unset;
	text-align: left;
}
#news .archive ol li a.btn{
	display: block;
	margin: 0 0 0 auto;
	width: 250px;
	height: 60px;
	line-height: 60px;
}

/* pagenavi */
.pagenavi{
	position: relative;
	text-align: center;
	letter-spacing: -.4em;
	margin: 60px auto 0;
}
.pagenavi span,.pagenavi a{
	position: relative;
	display: inline-block;
	min-width: 40px;
	width: auto;
	height: 40px;
	font-size: 2rem;
	letter-spacing: 0;
	line-height: 40px;
	vertical-align: middle;
	box-sizing: border-box;
	margin: 0 10px;
}
.pagenavi span{
	color: #FFF;
	background: #009e75;
}
.pagenavi a{
	color: #009e75;
	border: 1px solid #009e75;
}
.pagenavi a:hover{
	color: #FFF;
	background: #009e75;
}
.pagenavi .next,.pagenavi .prev{
	font-size: 0;
}
.pagenavi .prev::after,
.pagenavi .next::after{
	position: absolute;
	display: block;
	font-size: 2rem;
	line-height: 34px;
	top: 0;
	left: 14px;
}
.pagenavi .prev::after{
	content: "<";
}
.pagenavi .next::after{
	content: ">";
}

/* news - single
------------------------------ */
#news .single h1{
	color: #009e75;
	font-size: 3.6rem;
	line-height: 1.5;
	margin-bottom: 40px;
	padding-bottom: 5px;
	border-bottom: 1px solid #009e75;
}
#news .single h2{
	font-size: 3rem;
	margin-bottom: 30px;
	padding: 16px 20px 14px 28px;
}
/*#news .single a.btn{
	display: block;
	margin: 30px auto 20px;
}
#news .single dl{
	padding: 30px;
	background: #F2F2F2;
}
#news .single dl dt{
	color: #009e75;
	font-weight: 600;
	margin-bottom: 10px;
	border-bottom: 1px solid #009e75;
}
#news .single dl dd{
	font-size: 1.4rem;
	margin-bottom: 15px;
}
#news .single dl dd:last-child{
	margin-bottom: 0;
}*/
.adjacent_post_links{
	margin-top: 80px;
}
.adjacent_post_links .previous{
	float: left;
	max-width: 40%;
	text-align: left;
}
.adjacent_post_links .next{
	float: right;
	max-width: 40%;
}
.adjacent_post_links .previous a,
.adjacent_post_links .center a,
.adjacent_post_links .next a{
	position: relative;
	display: inline-block;
	color: #009e75;
	font-size: 1.6rem;
	line-height: 1.5;
}
.adjacent_post_links .previous a{
	padding-left: 30px;
}
.adjacent_post_links .next a{
	padding-right: 30px;
}
.adjacent_post_links .previous a::before{
	content: "";
	position: absolute;
	display: block;
	width: 16px;
	height: 16px;
	border-top: 2px solid #009e75;
	border-left: 2px solid #009e75;
	top:0;
	left: 0;
	bottom:0;
	margin: auto;
	transform: rotate(-45deg);
	transition: .35s
}
.adjacent_post_links .next a::before{
	content: "";
	position: absolute;
	display: block;
	width: 18px;
	height: 18px;
	border-top: 2px solid #009e75;
	border-right: 2px solid #009e75;
	transform: rotate(45deg);
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	transition: .35s
}
.adjacent_post_links .previous a:hover,.adjacent_post_links .next a:hover{
	color: #009e75;
}
.adjacent_post_links .previous a:hover::before{
	left: -5px;
}
.adjacent_post_links .next a:hover::before{
	right: -5px;
}
.adjacent_post_links li a{
	display: inline-block;
	text-decoration: none;
	color: #009e75;
}
.adjacent_post_links li a::after {
	content: "";
	display: block;
	width: 100%;
	transition: width 0.3s;
	border-bottom: 1px solid #009e75;
	margin: -3px auto 0;
	border-radius: 1px;
}
.adjacent_post_links li a:hover{
	text-decoration: none;
}
.adjacent_post_links li a:hover::after {
	width: 0;
}

/* aside
------------------------------ */
aside{
	width: 260px;
}
aside ul > li.categories{
	position: relative;
	display: block;
	background: #009e75;
	color: #fff;
	font-size: 2rem;
	line-height: 65px;
	font-weight: 600;
	text-align: center;
}
aside ul li.categories ul{
	background: #E7F7EF;
}
aside ul li.categories ul li a{
	position: relative;
	display: block;
	color: #000;
	font-size: 1.6rem;
	font-weight: 300;
	text-align: center;
	line-height: 60px;
	border-bottom: 1px solid #fff;
	box-sizing: border-box;
}
aside ul li ul li a:hover{
	color: #FFF;
	background: #009E75;
}

/* contact
------------------------------ */
#contact .main_title,#contact_thanks .main_title,
#yonmaruyon .main_title{
	background-image: url(../images/maintitle_contact.jpg);
	background-position: center top;
}
#contact01 .tel_box::before,#contact_thanks .tel_box::before{
	content: "";
	position: relative;
	display: block;
	width: 100%;
	height: 40px;
	margin-bottom: 20px;
	font-size: 0;
	background: url(../images/telG.svg) no-repeat center center;
	background-size: contain;
}
#contact02 form#mailformpro{
	padding-bottom: 0;
}
#contact02 table.lay2 tr th.top{
	vertical-align: top;
}
#contact02 table.lay2 tr th span{
	color: #FF0000;
	margin-left: 8px;
}
#contact02 table.lay2 tr td ul li{
	display: inline-block;
	vertical-align: middle;
	margin-right: 20px;
}
#contact02 table.lay2 tr td ul li input[type="radio"]{
	margin-top: -4.5px;
}
#contact02 table.lay2 tr td input[type="text"],
#contact02 table.lay2 tr td input[type="tel"],
#contact02 table.lay2 tr td input[type="email"]{
	width: 520px;
	height: 40px;
	font-size: 1.6rem;
	border: 0;
	padding: 0 5px;
	background: #F1F1F1;
	box-sizing: border-box;
}
#contact02 table.lay2 tr td input[type="date"]{
	width: 280px;
	height: 40px;
	font-size: 1.6rem;
	text-align: left!important;
	border: 0;
	padding: 0 5px;
	background: #F1F1F1;
	box-sizing: border-box;
}
#contact02 table.lay2 tr td .postal_code input[type="text"]{
	width: 272px;
	margin-bottom: 10px;
}
#contact02 table.lay2 tr td .postal_code{
	display: block;
}
#contact02 table.lay2 tr td textarea{
	max-width: 520px;
	width: 100%!important;
	min-height: 80px;
	border: 0;
	padding: 5px;
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: .05em;
	background: #F1F1F1;
	box-sizing: border-box;
}
#contact02 table.lay2 tr:last-of-type th{
	border-bottom: 1px solid #009E75;
}
#contact02 table.lay2 tr:last-of-type td{
	border-bottom: 1px solid #009E75;
}
#contact02 table.lay2 tr:last-of-type td textarea{
	min-height: 240px;
}
#contact02 #privacy_policy{
	position: relative;
	display: block;
	width: 100%;
	height: 200px;
	overflow: scroll;
	margin-top: 60px;
	padding: 30px;
	background: rgba(0,158,117,.1);
	box-sizing: border-box;
}
#contact02 #privacy_policy h3{
	font-size: 3rem;
	margin-bottom: 18px;
}
#contact02 #privacy_policy p.mt_10{
	position: relative;
	display: block;
	margin-top: 1rem;
}
#contact02 button{
	position: relative;
	display: block;
	width: 272px;
	height: 70px;
	border: 0;
	margin: 60px auto 0;
	box-shadow: none;
	cursor: pointer;
	transition: .35s;
}
/* contact - thanks
------------------------------ */
#contact_thanks .main_title .flex div{
    max-width: 750px;
}
#contack_thanks .sub_section{
	text-align: center;
}
#contact_thanks .sub_section .btn{
	display: block;
	margin: 60px auto 0;
}
/* footer
------------------------------ */
/* bottom_contact */
#bottom_contact{
	padding: 88px 0;
	background: url(../images/bottom_contact-bg.jpg) no-repeat center center;
	background-size: cover;
}
.sub #bottom_contact{
	margin-top: 200px;
}
#bottom_contact .wrapper div{
	width: 100%;
	text-align: center;
	padding: 55px 0;
	background: #FFF;
	box-sizing: border-box;
}
#bottom_contact .wrapper div:first-child{
	max-width: 430px;
}
#bottom_contact .wrapper div:nth-child(2){
	max-width: 815px;
}
#bottom_contact .wrapper div p{
	color: #009e75;
	font-size: 1.4rem;
	line-height: 1.7;
	margin-top: 22px;
}
#bottom_contact .wrapper div .tel{
	margin: 0 auto 15px;
}
#bottom_contact .wrapper div:nth-child(2) p{
	margin-top: 0;
	line-height: 1;
}
#bottom_contact .wrapper div a.btn.contact{
	width: 385px;
	margin-top: 35px;
}
/* //bottom_contact */
footer .pagetop{
	position: relative;
	display: block;
	width: 100%;
	height: 93px;
	background: #009e75;
}
footer .pagetop::before{
	content: "";
	position: absolute;
	display: block;
	width: 0;
	height: 93px;
	background: #85cfb2;
	top: 0;
	left: 0;
	transition: .35s;
}
footer .pagetop span{
	position: relative;
	display: block;
	font-size: 0;
	z-index: 1;
}
footer .pagetop span::before{
	content: "";
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	transform: rotate(45deg);
	top: 40px;
	left: 0;
	right: 0;
	margin: 0 auto;
	transition: .35s;
}
footer .pagetop:hover::before{
	width: 100%;
}
footer .pagetop:hover span::before{
	top: 35px;
}
.footer_contents{
	padding: 95px 0 50px;
	background: #f1f1f1;
}
.footer_contents .logo{
	position: relative;
	display: block;
	font-size: 0;
	width: 340px;
	height: 52px;
	background: url(../images/logo.svg) no-repeat center center;
	background-size: contain;
	margin: 0 0 15px;
}
.footer_contents div p{
	font-size: 1.4rem;
	line-height: 1.86;
}
.footer_menu{
	max-width: 430px;
	width: 100%;
}
.footer_menu ul li{
	line-height: 1;
	margin-top: 20px;
}
.footer_menu ul li:first-child{
	margin-top: 0;
}
.footer_menu ul li.sub{
	margin: 10px 0 0 1rem;
}
.footer_menu ul li.sub::before{
	content: "/ ";
}
.footer_menu ul li a{
	color: #000;
	font-size: 1.4rem;
	line-height: 1;
}
.footer_menu ul li a:hover{
	color: #009e75;
}
footer small{
	position: relative;
	display: block;
	width: 100%;
	height: 93px;
	color: #FFF;
	font-size: 1.2rem;
	line-height: 93px;
	text-align: center;
	background: #000;
}
footer small a.text_link{
	color: #FFF;
	line-height: 1;
}
footer small a.text_link::after{
	border-color: #FFF;
	margin-top: 0;
}
footer .banner{
	justify-content: flex-end;
}
footer a img{
	width: 200px;
	height: auto;
	display: block;
	margin: 10px 0 0 auto;
	border: 1px solid #000;
}

/* Breadcrumb
------------------------------ */
.breadcrumbs{
	position: relative;
	width: 100%;
	color: #000;
	font-size: 1.4rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: .05em;
	align-items: center;
	margin-bottom: 80px;
	padding: 30px 0 29px;
	background: #C1E8D8;
}
.breadcrumbs a{
	color: #000;
}
.breadcrumbs a:hover{
	color: #009E75;
}
.breadcrumbs span{
	letter-spacing: .05em;
}

/* yonmaruyon
------------------------------ */
#yonmaruyon .main_title .flex div {
    max-width: 390px;
    height: 160px;
}
#yonmaruyon01{
	text-align: center;
}
#yonmaruyon01 .tel_box{
	padding-top: 30px;
	height: 200px;
}
#yonmaruyon01 .tel_box .tel{
	margin: 30px auto 20px;
	height: 30px;
}
#yonmaruyon01 a.btn{
	display: block;
	margin: 50px auto 0;
}

/* Page Top
------------------------------ */
/*.pagetop{
	position: fixed;
	bottom: 40px;
	right: 50px;
	width: 50px;
	height: 50px;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s;
	opacity: 0;
	z-index: 10;
}
.pagetop.show{
	opacity: 1;
	bottom: 60px;
	right: 50px;
	width: 50px;
	height: 50px;
}
.pagetop a{
	position: relative;
	display: block;
	width: 60px;
	height: 60px;
	text-align: left;
	text-indent: -9999px;
	border: 1px solid #31BB9D;
	background: #31BB9D;
	box-sizing: border-box;
}
.pagetop a:hover{
	background: #FFF;
}
.pagetop a::before{
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	border-top: #FFF solid 1px;
	border-left: #FFF solid 1px;
	transform: rotate(45deg);
	left: 0;
	right: 0;
	margin: 0 auto;
	top: 24px;
	transition: .25s;
}
.pagetop a:hover::before{
	border-top-color: #31BB9D;
	border-left-color: #31BB9D;
}*/

/* Page Navi
------------------------------ */
/*.wp-pagenavi{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	text-align: center;
}
.wp-pagenavi a, .wp-pagenavi span{
	padding: 0;
}
.wp-pagenavi span.pages{
	display: none;
}
.wp-pagenavi span.current{
	border: 0;
}
.wp-pagenavi a:hover{
	border-color: #32B0E5;
}*/

.wp-pagenavi{
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	text-align: center;
	margin-top: 60px;
}
.wp-pagenavi span,
.wp-pagenavi a{
	position: relative;
	display: inline-block;
	width: 30px;
	height: 33px;
	line-height: 29px;
	vertical-align: middle;
	margin-right: 8px;
	border: 0;
	box-sizing: border-box;
}
.wp-pagenavi span{
	color: #FFF;
	background: #009E75;
}
.wp-pagenavi span.pages{
	display: none;
}
.wp-pagenavi a{
	color: #009E75;
	line-height: 28px;
	background: #FFF;
	border: 1px solid #009E75;
	box-sizing: border-box;
}
.wp-pagenavi a.nextpostslink,
.wp-pagenavi a.previouspostslink{
	font-size: 2.5rem;
	line-height: 24px;
}
.wp-pagenavi a:hover{
	color: #FFF;
	border-color: #009E75;
	background: #009E75;
}

/* IE用cssハック */
@media all and (-ms-high-contrast: none) {
	body,#lead{
		font-weight: 500;
	}
	.fw_6{
		font-weight: bold;
	}
	#index #index02 h2{
		letter-spacing: -.02em;
	}
}

/* ノートパソコン */
@media screen and (max-width: 1399px) {
	#index03 .bg_W .pict div:first-child{
		width: 500px;
	}
	#index03 .bg_W.left_contents .pict div:nth-child(2){
		left: 70px;
	}
	#index03 .bg_W.right_contents .pict div:nth-child(2){
		left: 62px;
	}
}