/*-----------
reset
-----------*/
* {margin: 0;padding: 0;}

.cf { zoom: 1; }
.cf:before,.cf:after { content: ""; display: table;}
.cf:after { clear: both;}

/*-----------
body
-----------*/
body{color: #fff; font-size: 18px; width: 100%; background: linear-gradient(-45deg,#000 0%,#000d12 10%,#001205 25%,#021200 43%,#0e1200 63%, #120700 75%, #090000 90%,#000 100%);font-family: 'M PLUS Rounded 1c', sans-serif;overflow-x: hidden;}
body.zh{font-family: 'Noto Sans TC', sans-serif;}
img{height: auto;}


@media screen and (max-width: 800px){
	body{width: 100%;}
	img{width: 100%;}
}

/*-----------
commone
-----------*/
.left{float: left;}
.right{float: right;}
.listL li{float: left;}

a{color: #fff;}
a:hover{text-decoration: none;}
a:hover img{filter:alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7;}

/*flex box*/
.flex{display: flex; align-items: flex-start;}
.flex img{align-items: flex-start;}
.mleft{margin-left: auto;}
.mright{margin-right: auto;}
.mtop{margin-top: auto;}
.mbottom{margin-bottom: auto;}

/*-----------
header
-----------*/
header{width: 100%; padding: 5px 10px; position: absolute; top: 0; left: 0;justify-content: space-between; box-sizing: border-box; z-index: 20;}
header h1.flex{font-size: 0.8em; margin: 0; line-height: 1.8em;color: #000; font-weight: 100;}
header h1 img{width: 30%; max-width:130px; height: auto;filter: drop-shadow(1px 1px 3px #fff);}
header h1 span{margin-left: 1em;text-shadow: 1px 1px 3px #fff,-1px -1px 3px #fff, 1px 1px 3px #fff,-1px -1px 3px #fff;}
header .social{display: flex; justify-content: space-between;line-height: 1em;}
header .social a{width: 35px; margin-left: 10px;}

@media screen and ( max-width:1280px ) {
	header{min-width: 100%;}
	header .inner{width: 98%; margin: 0 auto;}
}

@media screen and ( max-width:768px ) {
	header h1 {width: 100%;}
	header h1 span{line-height: 1.2em; display: none;}
}

@media screen and ( max-width:560px ) {
	header .social{display: none;}
}


/*言語プルダウン*/
#language-select{position: relative; float: none; top: auto;left: auto;}
#language-select .dropdown dt a{background:rgba(0,0,0,0.5);}
#language-select .dropdown dd ul li a em, #language-select .dropdown dt a em,#language-select .dropdown a{width: 90px; color:#fff;}
#language-select .dropdown dd ul li:hover a em{color:#000;}
#language-select .dropdown {position: relative!important;right: auto ;margin: 0;}
#language-select .dropdown dt a,#language-select .dropdown dt a.activemode{background:rgba(0,0,0,0.5);border: 1px solid #fff;color: #fff;padding: 8px;}
#language-select .dropdown dt a:hover,#language-select .dropdown dt a.activemode{border-bottom-left-radius: 0; border-bottom-right-radius: 0; color: #000;}
#language-select .dropdown dt a:hover,#language-select .dropdown dt a.activemode:hover{background:rgba(0,0,0,0.5);color: #000;}
#language-select .dropdown dd ul li a{padding: 8px; color: #fff;}
.dropdown dd ul li a:hover {background-color: #fff; color: #000;}
#language-select .dropdown dd ul li a em:hover{ color: #000;}
#language-select .dropdown dd ul{left: 0;background:rgba(0,0,0,0.5);border: 1px solid #fff;color: #fff; background:rgba(0,0,0,0.5);}


@media screen and (max-width: 768px){

	#language-select {position: relative;top: 0;right: auto;max-height: none;text-align: left;width: 200px; margin-left: auto;}
	#language-select .dropdown a{width: 90%;}
	#language-select .dropdown dd ul li a em, #language-select .dropdown dt a em{width: 100%;}
	#language-select .dropdown dt a,#language-select .dropdown dt a.activemode{padding: 5% 5%;}
	#language-select .dropdown dd,#language-select .dropdown dd ul{width: 100%;}
	#language-select .dropdown dd ul li a{width: 90%; padding: 2% 5%;}
	
}
/*-----------
top_cnt
-----------*/
#top_cnt{background: url(../../../images/header.jpg) repeat-x; background-size: cover;height: inherit;}
#top_cnt .flex{justify-content: space-between; width: 98%; margin: 0 auto;align-items: flex-end;position: relative; z-index: 10; }
#top_cnt p{width: 65.8%;}
#top_cnt h2{width: 31.85%;}
  @media screen and ( max-width:768px ) {
	#top_cnt .flex{flex-direction: column-reverse ; justify-content: flex-start;}
	#top_cnt p{width: 100%;}
	#top_cnt h2{width: 50%;}
	#top_cnt h2.en{margin-bottom: -7%;}
}
/*-----------
commone
-----------*/
article h2{text-align: center;margin-top: 0.5em; font-weight: 400; padding: 0 1%; box-sizing: border-box;}
article p{text-align: center;font-weight: 100;font-size: 1.2em;padding: 0 1%; box-sizing: border-box;}
section{max-width: 640px; width: 95%; margin: 0 auto 0;}

@media screen and ( max-width:768px ) {
	article h2 br,article p br{display: block;}
}

@media screen and ( max-width:500px ) {
	article h2{font-size: 2em;}
	article p{font-size: 1.5em;}
	article h2 br,article p br{display: none;}
}
/*-----------
footer
-----------*/
footer{padding:3em 0;} 
footer .btn {border: 1px solid #fff; padding: 0.5em 0.5em; max-width: 400px; box-sizing: border-box;display: block; margin: 0 auto;text-align: center;text-decoration: none; color: #fff; font-weight: 100;overflow: hidden; position: relative;}
footer .btn.en{max-width: 400px;}
footer .btn::after{content: "";position: absolute; width: 100%; height: 100%; background: #fff; left: -100%; top: 0;transition: .2s;}
footer .btn:hover::after{left: 0%; top: 0; z-index: -1;}
footer .btn:hover{color: #000;}
footer p{font-size: 0.8em;font-weight: 200; text-align: center; width: 95%;margin: 0 auto;}
footer p.top{margin-top: 2em;}