@charset "UTF-8";

/*----------------------------------------------------------------------------------------------------
	全ページ共通スタイル
----------------------------------------------------------------------------------------------------*/

/* 要素設定*/
body {
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	
	min-width:1200px;
	margin:0 auto;
}

body.maxScreen{
	max-width:1920px;
}

.mincho {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

img{
	max-width:100%;
}

.ml{
	margin:0 0 0 0.5em;
}

.mr{
	margin:0 0.5em 0 0;
}

.ml2{
	margin:0 0 0 1.5em;
}

/* placeholder */
:placeholder-shown {
	color:#ccc;
}

::-webkit-input-placeholder {
	color:#ccc;
}

:-moz-placeholder {
	color:#ccc;
	opacity: 1;
}

::-moz-placeholder {
	color:#ccc;
	opacity: 1;
}

:-ms-input-placeholder {
	color:#ccc;
}

/* section wrap */
.secWrap{
	position:relative;
	width:100%;
	height:100%;
	
	padding:0 0 6em 0;
}

.bodyLine{
	position:fixed;
	z-index:2;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:96vw;
	height:94vh;
	border:1px solid #28521b;
	pointer-events: none;
}

.bodyLine.move{
	border-bottom:none;
}



/*　ラッパー
---------------------------------------------------------------------------------------*/
.wrap{
	width:1200px;
	margin:0 auto;
}



/*　ヘッダー
---------------------------------------------------------------------------------------*/
.logo{
	text-align:center;
	margin:0 0 7em 0;
}

.logo a{
	display:inline-block;
}

.headers{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 75%;
    z-index: 5;
    color: #fff;
    left: 0;
    right: 0;
    height: 20%;
}

.nav{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:start;
	    -ms-flex-align:start;
	        align-items:flex-start;
	-webkit-box-pack:center;
	    -ms-flex-pack:center;
	        justify-content:center;
}

.nav li{
	text-align:center;
	margin:0 1em;
	position:relative;
	padding:0 0 0.35em 0;
	border-bottom:1px solid transparent;
}

.nav li a{
	color:#fff;
	position:relative;
	padding:0 1em 0.35em 1em;

	-webkit-backface-visibility:hidden;
	        backface-visibility:hidden;
}

.nav li > ul{
	display:none;
	list-style-type:disc;
	margin:0;
	padding:0 0 0 1.5em;
	text-align:left;
	text-indent:-0.8em;
	position:absolute;
	top:auto;
	left:0;
	z-index:5;
}

.nav li > ul li{
	width:auto;
	padding:0.25em;
	margin:0.05em 0;
	border-bottom:none;

	text-align:left;
}

.nav li > ul li:first-child{
	margin:1em 0 0.05em 0;
}

.nav li > ul li a{
	color:#fff;
	white-space:nowrap;
	padding:0.15em 0.25em;
}

.nav li > ul li a:hover{
	color:#fff;
	background:rgba(68,128,49,0.8);
	border-bottom:none;
	opacity:1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.nav li:hover{
	border-bottom:1px solid #fff;
}

.nav li.selected{
	border-bottom:1px solid #fff;
}

.nav li.navSeparate:hover{
	border-bottom:none;
}

.nav li > ul li:hover{
	border-bottom:none;
}

.nav li:hover ul{
	display:block;
}

.spNav{
	display:none;
}



/*　サブページヘッダー
---------------------------------------------------------------------------------------*/
.subHeader{
    position: absolute;
    z-index: 3;
    top: 48px;
    width: 94%;
    margin: auto;
    left: 0;
    right: 0;
}

.subHeader .headWrap{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.subHeader .logo{
	margin:0;
}

.subHeader .nav{
	padding:0 0 0 10em;
}

.subHeader .nav > li.navSeparate{
	color:#fff;
}

.subHeader .nav li > ul{
	color:#fff;
}



/*　固定ヘッダー
---------------------------------------------------------------------------------------*/
.fixHeaderBg{
    position: fixed;
    z-index: 6;
    background: rgba(255,255,255,0.8);
    width: 100%;
    height: 112px;

	opacity:0;

	-webkit-transform:translateY(-10vh);
	        transform:translateY(-10vh);

	-webkit-transition: all linear 0.2s;

	transition:all linear 0.2s;
}

.fixHeader{
    position: fixed;
    z-index: 7;
    top: 48px;
    width: 94%;
    margin: auto;
    left: 0;
    right: 0;

	opacity:0;
	-webkit-transform:translateY(-10vh);
	        transform:translateY(-10vh);

	-webkit-transition: all linear 0.2s;

	transition:all linear 0.2s;
}

.fixHeader .headWrap{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.fixHeader .logo{
	margin:0;
}

.fixHeader .nav{
	padding:0 0 0 10em;
}

.fixHeader .nav li a{
	color:#000;
}

.fixHeader .nav > li:hover{
	border-bottom:1px solid #3E8A28;
}

.fixHeader .nav > li.selected{
	border-bottom:1px solid #3E8A28;
}

.fixHeader .nav > li.navSeparate:hover{
	border-bottom:none;
}



/*　固定サイドバー
---------------------------------------------------------------------------------------*/
.fixSidebar{
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width:62px;
    height: 50%;
    z-index: 5;

	-webkit-transition: all linear 0.2s;

	transition:all linear 0.2s;
}

.fixSidebar i.doc:after,
.fixSidebar i.envelope:after{
	position:static;
	display:inline-block;
	height:24px;
	margin:0.25em 0;
}

.fixSidebar a{
	-webkit-writing-mode:vertical-lr;
	    -ms-writing-mode:tb-lr;
	        writing-mode:vertical-lr;

    background:#3e8a28;
    color: #fff;
    font-size:17px;
	padding:20px 18px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

.fixSidebar a:hover{
	background:#666;
	opacity:1;
}



/*　固定ヘッダー・フッターアニメーション
---------------------------------------------------------------------------------------*/
.fadeInHead{
	opacity:1;
	-webkit-transform:translateY(0);
	        transform:translateY(0);
}

.fadeInRight{
	opacity:1;
	-webkit-transform:translateX(0);
	        transform:translateX(0);
}



/*　フッター
---------------------------------------------------------------------------------------*/
.footerWrap{
	position:relative;
	z-index:3;
}

.footerLogoBox{
	width:96%;
	max-width:1200px;
	margin:0 auto;
}

.footerLogoWrapUp{
	position:relative;
	top:-10px;
	padding:0 0 1em 0;
}

.footerTel{
    color: #3e8a28;
	font-size: 32px;
}

.addrLine{
	display:block;
	width:100%;
	height:1px;
	position:absolute;
	bottom:0;
	left:-50%;
	
	background:#3e8a28;;
}

.footerAddrEn{
	margin:1em 0 0.5em 0;
}

.footerAddrEn p{
	font-size:14px;
}

.footerAddr{
	position:relative;
}

.footerAddr p{
	font-size:14px;
}

.footerAddr:after{
    display: inline-block;
    content: "";
    width: 40px;
    height: 1px;
    background: #3E8A28;
    position: absolute;
    bottom: -8px;
    left: 0;
}

.copyright{
	width:90%;
	margin:0 auto;
	text-align:right;
}

.copyright p{
	color:#999;
	font-size:14px;
}

.pagetop{
	position:fixed;
	z-index:10;
	bottom:5%;
	right:5%;
}

.pagetop a{
    display: inline-block;
    color:#76ab63;
    line-height: 100%;
    position: relative;
    padding: 2em;
}

.pagetop a:before{
	content: "";
    height: 2px;
    width: 38px;
    background: #76ab63;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
}

.pagetop a:after{
	content: "";
    height: 2px;
    width: 38px;
    background: #76ab63;
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
}



/*　サブページヘッダー
---------------------------------------------------------------------------------------*/
.sHead{
	position:relative;
}

.sHeadImage img{
	width:100%;
	height:auto;
}

.sHeadPTitle{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;

	width:32%;
	height:12%;

	text-align:center;
}



/*　サブページヘッダー
---------------------------------------------------------------------------------------*/
.sSecTitle{
	position:relative;
}

.sSecTitle:after{
	content:"";
	width:110%;
	height:1px;
	background:#000;

	position:absolute;
	bottom:0;
	left:0;
}

.sSecTitleInner{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	    -ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack:center;
	    -ms-flex-pack:center;
	        justify-content:center;
}

.ssNum{
	width: 30%;
    text-align: right;
    box-sizing: border-box;
}

.ssNumInner{
	position: relative;
    padding: 1em 3em;
}

.ssNumInner:after{
	content: "";
    width: 1px;
    height: 115px;
    background: #000;
    position: absolute;
    top: 0;
    right: 0;
}

.ssNumWraps{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
	-ms-flex-direction:row;
	        flex-direction:row;
	-webkit-box-align:center;
	-ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack:end;
	-ms-flex-pack:end;
	        justify-content:flex-end;
}

.ssNumText{
	text-align:right;
}

.ssNumText h3{
	font-size:24px;
	letter-spacing:0.15em;
	line-height:100%;
}

.ssNumText img{
	margin:0 0.5em 0 0;
}

.ssNums{
	padding:0 0 0 2em;
}

.ssName{
    width: 25%;
    box-sizing: border-box;
    padding: 1em 2em;
}

.ssName h3{
	font-size:20px;
	line-height:152%;
	letter-spacing:0.05em;
}

.ssEn{
    width: 45%;
    box-sizing: border-box;
    -ms-flex-item-align: end;
        align-self: flex-end;
}

.ssEnInner{
    position: relative;
    padding:1em;
}

.ssEnInner:after{
    content: "";
    width: 1px;
    height: 286px;
    background: #000;
    position: absolute;
    top: -24px;
    right: 0;
}



/*---------------------------------------------------------
 section title border
 ---------------------------------------------------------*/
@media screen and (max-width:1460px) {

	/* section title */
	.sSecTitle:after{
		width:100%;
	}

	.ssEnInner:after{
		right:10%;
	}
	
	.ssEnInner img{
		max-width:80%;
	}



}



/*---------------------------------------------------------
 All SP & Tablet 
 ---------------------------------------------------------*/
@media screen and (max-width:1150px) {

	/* default */
	body{
		min-width:1200px;
	}

	.fixHeaderBg,
	.fixHeader,
	.fixSidebar{
		display:none;
	}

	.spNav{
		display:block;
	}



}



/*---------------------------------------------------------
 ipad(1024)
 ---------------------------------------------------------*/
@media screen and (max-width:1024px) {

	.bodyLine{
		width:97%;
		height:97%;
	}



}



/*---------------------------------------------------------
 All SP 
---------------------------------------------------------*/
@media screen and (max-width: 639px) {

	/* default */
	.bodyLine{
		width:96vw;
		height:94vh;
	}

	body{
		min-width:1px;
	}

	.spNav{
		display:block;
	}

	.wrap{
		width:auto;
	}

	/* header */
	.nav{
		display:none;
	}



	/* sub header */
	.sHeader{
		position:relative;
	}

	.subHeader{
		top:0;
		left:0;
		right:0;
		bottom:0;
		margin:auto;
		width:100%;
		height:20%;
		text-align:center;
	}

	.subHeader .headWrap{
		justify-content:center;
	}

	.sHeadPTitle{
		display:none;
	}



	/* section title */
	.sSecTitle{
		padding:0 1em;
	}

	.sSecTitleInner{
		padding:0 1em;
	}

	.ssNumWraps{
		-webkit-box-pack:start;
		-ms-flex-pack:start;
		justify-content:flex-start;
	}

	.ssNum{
		width:100%;
		text-align:left;
	}

	.ssNumInner{
		position:static;
		padding:0;
	}

	.ssNumInner:after{
		left:3%;
		height:240%;
	}

	.ssName{
		width:100%;
		padding:1em 0;
	}

	.ssEn{
		width:100%;
	}

	.ssEnInner{
		padding:0;
	}

	.ssEnInner:after{
		right:0;
	}



	/* footer */
	.footerWrap{
		padding:0 1em;
	}

	.footerLogoBox{
		width:auto;
	}

	.footerAddrEn p{
		font-size:90%;
	}

	.footerAddr p{
		font-size:90%;
	}

	.qCircle{
		background-size:50%;
	}



}

/*---------------------------------------------------------
 Portrait 
---------------------------------------------------------*/
@media screen and (max-width:479px) {

	/* section title */
	.ssEnInner:after{
		right:-5%;
	}

	/* footer */
	.copyright{
		margin:3em auto 0 auto;
	}



}