@charset "utf-8";

body{
	min-width: 1200px;
}

/* header
--------------*/
.header{
	position: relative;
	background: #fff;
}
.headerInner{
	max-width: 1200px;
	margin: auto;
	padding:18px 0 18px 18px;
	font-size: 0;
}
.headerInner > *{
	display: inline-block;
	vertical-align: middle;
}
.headerLogo{
	max-width: 284px;
}
.headerNav{
	margin-left: 100px;
}
.headerNavInner{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.headerNavInner > li{
	margin-left: 25px;
	font-size: 1.4rem;
}
.headerNavInner > li:first-child{
	margin-left: 0;
}
.headerNavInner > li > a{
	position: relative;
	display: block;
	color: #000000;
	padding-left: 20px;
}
.headerNavInner > li > a:hover{
	text-decoration: underline;
}
.headerNavInner > li > a:before{
	content: "";
	position: absolute;
	top:50%;
	left: 0;
	width: 6px;
	height: 6px;
	transform: translateY(-50%);
	border-radius: 50%;
}
.headerNavIco01:before,
.headerNavIco03:before,
.headerNavIco05:before{
	background-color: #60c0bd;
}
.headerNavIco02:before,
.headerNavIco04:before{
	background-color: #ef9091;
}

.headerLang{
	margin-right: 35px;
	width: 68px;
}
#cn .headerLang{
	width: 52px;
}
.headerNav + .headerLang{
	margin-left: 100px;
}
.headerSpMenu{
	display: none;
}



/* footer
--------------*/
.footer{
	background: #60c0bd
}
.footerInner{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	max-width: 1200px;
	margin: auto;
	padding:20px 0 30px 12px;
}
.footerNavInner{
	font-size: 0;
}
.footerNavInner > li{
	display: inline-block;
	margin-left: 15px;
	font-size: 1.4rem;
	vertical-align: middle;
}
.footerNavInner > li:first-child{
	margin-left: 0;
}
.footerNavInner > li:before{
	content: ">";
	display: inline-block;
	margin-right: 6px;
	color: #fff;
	vertical-align: middle;
}
.footerNavInner > li > a{
	display: inline-block;
	color: #fff;
	vertical-align: middle;
}
.footerNavInner > li > a:hover{
	text-decoration: underline;
}

.footerInfoInner{
	font-size: 0;
}
.footerInfoInner > li{
	display: inline-block;
	margin-left: 15px;
	font-size: 1.4rem;
	vertical-align: middle;
}
.footerInfoInner > li:first-child{
	margin-left: 0;
}
.footerInfoInner > li:before{
	content: "｜";
	display: inline-block;
	margin-right: 6px;
	color: #fff;
	vertical-align: middle;
}
.footerInfoInner > li:last-child:after{
	content: "｜";
	display: inline-block;
	margin-left: 6px;
	color: #fff;
	vertical-align: middle;
}
.footerInfoInner > li > a{
	display: inline-block;
	color: #fff;
	vertical-align: middle;
}
.footerInfoInner > li > a:hover{
	text-decoration: underline;
}

.wrap{
	position: relative;
	display: block;
	overflow: hidden;
}


@media screen and (max-width: 767px){
	body{
		min-width: inherit;
		font-size: 1.4rem;
	}
	/* header
	--------------*/
	.headerNav {
    position: absolute;
    top: 0;
    right: -100%;
    padding: 70px 0;
    background: #fff;
    margin-left: 0;
    z-index: 10;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
	}
	.headerNav.open{
		right: 0;
	}
	.headerNavInner {
	  display: block;
	}
	.headerNavInner > li {
    margin-left: 0;
    font-size: 1.4rem;
	}
	.headerNavInner > li > a {
    padding: 15px 20px 15px 40px;
	}
	.headerNavInner > li > a:before {
    left: 20px;
	}
	.headerNavInner > li > a.headerNavIco00:before{
		left: 16px;
		width: 15px;
		height:15px;
		background-color: #ef9091;
	}
	.headerNavInner > li > a.headerNavIco01:before{
		left: 16px;
		width: 15px;
		height:15px;
	}
	.headerLogo{
		max-width: 182px;
	}
	.headerInner {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
	    margin: auto;
	    padding: 18px 20px 20px 20px;
	    font-size: 0;
	}
	.headerLang {
		display: block;
	    margin-right: 15px;
	    width: 40px;
	}
	#cn .headerLang {
	    margin-right: 15px;
	    width: 26px;
	}
	.headerNav + .headerLang {
    	margin-left: auto;
	}
	.headerSpMenu{
		display: inline-block;
	}
	.menuTrigger,
	.menuTrigger span {
	    display: inline-block;
	    -webkit-transition: all .4s;
	    -o-transition: all .4s;
	    transition: all .4s;
	    -webkit-box-sizing: border-box;
	            box-sizing: border-box;
	}
	.menuTrigger {
	    position: relative;
	    width: 28px;
	    height: 22px;
	    z-index: 15;
	}
	.menuTrigger span {
	    position: absolute;
	    left: 0;
	    width: 100%;
	    height: 4px;
	    background-color: #222;
	}
	.menuTrigger span:nth-of-type(1) {
	    top: 0;
	}
	.menuTrigger span:nth-of-type(2) {
	    top: 9px;
	}
	.menuTrigger span:nth-of-type(3) {
	    bottom: 0;
	}
	.menuTrigger:before{
		content: "";
		position: absolute;
		top:6px;
		left: -40px;
		width: 30px;
		height: 10px;
		background:url(/common/img/txt_close01.png) 0 0 no-repeat;
		background-size: cover;
		visibility: hidden;
	}
	.menuTrigger.active:before{
		-webkit-animation: close .5s ease-out forwards;
		        animation: close .5s ease-out forwards;
	}
	@-webkit-keyframes close {
	  0% {visibility: hidden;}
	  100% {visibility:visible;}
	}
	@keyframes close {
	   0% {visibility: hidden;}
	  100% {visibility:visible;}
	}
	.menuTrigger.active span:nth-of-type(1) {
	    -webkit-transform: translateY(3px) rotate(45deg);
	    -ms-transform: translateY(3px) rotate(45deg);
	        transform: translateY(3px) rotate(45deg);
	    width: 15px;
		  left: 13px;
	}
	.menuTrigger.active span:nth-of-type(2) {
	    
	}
	.menuTrigger.active span:nth-of-type(3) {
	    -webkit-transform: translateY(-3px) rotate(-45deg);
		  -ms-transform: translateY(-3px) rotate(-45deg);
		      transform: translateY(-3px) rotate(-45deg);
		  width: 15px;
		  left: 13px;
	}
	/* footer
	--------------*/
	.footerNav{
		display: none;
	}
	.footerInner{
		display: block;
		padding: 15px 20px;
	}
	.footerInfo{
		text-align: right;
	}
	.footerInfoInner> li{
		font-size: 1.1rem;
	}
	.footerInfoInner > li.footerInfoNone{
		display: none;
	}
	.footerInfoNone + li:before{
		content: normal;
	}
	.footerInfoInner > li:last-child:after{
		content: normal;
	}
	.footerInfoInner > li > a:hover{
		text-decoration: none;
	}
}



.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; opacity: 0; }

@-webkit-keyframes zoomIn { from { opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  to { opacity: 1; } }

@keyframes zoomIn { from { opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3); }
  to { opacity: 1; } }

.zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; }