@charset "shift_jis";

/* --------------------------------------------------------------------------------

【スマートフォン】
www.melodian.co.jp
	
-------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------
	リセット
-------------------------------------------------------------------------------- */
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
}
body{
	padding:16.5vw 0 0;
	line-height:1.3;
/*	font-size:3.5vw;*/
	font-size:5vw;
	font-family:Helvetica, Arial,'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif;
	-webkit-text-size-adjust:100%;
	color:#4d4d4d;
}
h1,h2,h3,h4,h5,h6,
input,
textarea{
	font-weight:normal;
/*	font-size:100%;*/
}
ol,ul{
	list-style:none;
}
blockquote,q{
	quotes:none;
}
blockquote:before,blockquote:after,
q:before,q:after{
	content:'';
	content:none;
}
input,
textarea,
select{
	font-family:Helvetica, Arial,'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}

img{
	max-width:100%;
	height:auto;
	border:none;
	-ms-interpolation-mode:bicubic;
	vertical-align:bottom;
}
a{
	text-decoration:none;
}
a img{
	border:none;
	vertical-align:bottom;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
    display:block;
}
ul{
	list-style:none;
	margin:0;
	padding:0;
}


a{
    -webkit-tap-highlight-color:rgba(0,0,0,0.1);
	tap-highlight-color:rgba(0,0,0,0.8);
}

input{
	-webkit-border-radius:100%;
	border-radius:0;
}
input, select{
	max-width:100%;
	height:auto;
	vertical-align:middle;
}


/* --------------------------------------------------------------------------------
	共通クラス
-------------------------------------------------------------------------------- */
.clear{
	clear:both;
}
br.clear{
	display:block;
	margin:0;
	padding:0;
	clear:both;
	height:0;
	border:none;
	visibility:hidden;
	font-size:0;
}
.clearfix:after{
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}
.clearfix{
	min-height:1%;
}
* html .clearfix{
	height:1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

ul.ul{
	list-style:disc;
	padding:0 0 0 1.5em;
}
ol.ol{
	list-style:decimal;
	padding:0 0 0 1.75em;
}

/********** プレースホルダー **********/
::-webkit-input-placeholder{
	color:#000;
}


/* --------------------------------------------------------------------------------
	デバイスごとの表示・非表示切り替え用
-------------------------------------------------------------------------------- */
.device-sp{
	display:block;
}
.device-sp-inline{
	display:inline;
}
.device-pc{
	display:none;
}
.device-pc-inline{
	display:none;
}


/* --------------------------------------------------------------------------------
	container
-------------------------------------------------------------------------------- */
#container{
}


/* --------------------------------------------------------------------------------
	header
-------------------------------------------------------------------------------- */
#header{
	position:fixed;
	width:100%;
	top:0;
	left:0;
	z-index:999999;
}

#header .inner{
	width:100%;
	display:flex;
	background:#e50012;
}

/********** ロゴ **********/
#header .logo{
	width:55%;
	padding:4.2% 0 0;
	background:#fff;
}
#header .logo a,
#header .logo a img{
	display:block;
}
#header .logo a{
	margin:0 0 0 6%;
}
#header .logo a img{
	width:32vw;
}

/********** 言語 **********/
#header .language{
	display:flex;
	
	width:29%;
	background:#fff;
}
#header .language .language-box{
	display:flex;
	justify-content:space-between;
	
	width:95%;
	font-size:0.5em;
}
#header .language .language-box .btn-language{
	display:flex;
	
	width:47%;
	padding:1.75vw 0;
}
#header .language .language-box .btn-language a{
	display:flex;
	align-items:center;
	
	width:calc(100% - 1vw);
	border-radius:1.5vw;
	border:solid 0.5vw #e6e6e6;
	font-weight:bold;
	color:#828282;
}
#header .language .language-box .btn-language a .label{
	width:100%;
	display:block;
	text-align:center;
}

/********** メニュー **********/
#header .h-nav{
	width:16%;
}

/********** サブメニュー **********/
#header .h-nav-menu .sub-menu{
	display:none;
	width:100%;
	position:absolute;
	left:0;
	padding:0;
	z-index:999999;
	background:rgba(255,255,255,1);
}
#header .h-nav-menu .sub-menu ul li{
	margin:0 0 1vw;
}
#header .h-nav-menu .sub-menu ul li:last-child{
	margin:0 0 0;
}

/* MENU・CLOSE */
#header .h-nav-menu{
	text-align:right;
}
#header .h-nav-menu img{
	width:100%;
}

/* MENU・CLOSE切り替え */
#header .h-nav-menu .h-btn-open{
	display:block;
}
#header .h-nav-menu .h-btn-close{
	display:none;
}

/* MENU・CLOSE切り替え */
#header .h-nav-menu.active-sp .h-btn-open{
	display:none;
}
#header .h-nav-menu.active-sp .h-btn-close{
	display:block;
}

/* --------------------------------------------------------------------------------
	wrapper
-------------------------------------------------------------------------------- */
#wrapper{
	padding:0 0 2vw;
}


/* --------------------------------------------------------------------------------
	main
-------------------------------------------------------------------------------- */
#main{
}

/*#main .breadcrumb{
	display:none;
}*/
/********** パンくずリスト **********/
#main .breadcrumb ul{
	display:flex;
	justify-content:flex-start;
	flex-wrap:wrap;
	margin:0 auto;
	padding:2vw 4vw 3vw;
	font-size:0.7em;
	line-height:1.7;
}
#main .breadcrumb ul li:after{
	margin:0 0.5em;
	content:'>';
}
#main .breadcrumb ul li:last-child:after{
	margin:0;
	content:'';
}
#main .breadcrumb ul li a{
	color:#e60012;
}

/* --------------------------------------------------------------------------------
	footer
-------------------------------------------------------------------------------- */
#footer{
	border-top:1px solid #E6E6E6;
	border-bottom:5px solid #e50012;
}

#footer .f-contents{
	padding:5vw 4.3vw 4.8vw;
}

/********** ナビゲーション **********/
#footer .f-nav .f-menu1 ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
#footer .f-nav .f-menu1 ul{
	margin:0 0 1vw;
	line-height:1.2;
}
#footer .f-nav .f-menu1 ul li{
	width:48%;
	padding:0 0 2.5vw;
}
#footer .f-nav .f-menu1 ul li a{
	display:block;
	border-radius:2vw;
	padding:3.3vw 0;
	text-align:center;
	font-weight:bold;
	color:#333;
	background:#F2F2F2;
}

/********** HOME **********/
#footer .f-nav .f-menu1 ul li.home{
	width:100%;
}
#footer .f-nav .f-menu1 ul li.home a{
	padding:2.8vw 0;
	border:solid 0.2em #fff;
	color:#fff;
	background:#B3B3B3;
}

/********** menu-logo **********/
#footer .menu-logo{
}

/********** メニュー **********/
#footer .f-menu2{
	padding:0 3vw 4.5vw;
	font-size:0.9em;
	color:#4D4D4D;
}
#footer .f-menu2 .f-menu-box{
	padding:0 0 2vw;
}
#footer .f-menu2 a{
	color:#4D4D4D;
}
#footer .f-menu2 .br{
	display:block;
	padding:2vw 0 0;
}



/********** 言語・ロゴ **********/
#footer .language-logo{
	display:flex;
	justify-content:space-between;
}


/********** 言語 **********/
#footer .language.device-sp{
	display:flex;
	
	width:31.5%;
	margin:0 0 0 23%;
	background:#fff;
}
#footer .language.device-sp .language-box{
	display:flex;
	justify-content:space-between;
	
	width:95%;
	font-size:0.5em;
}
#footer .language.device-sp .language-box .btn-language{
	display:flex;
	
	width:47%;
}
#footer .language.device-sp .language-box .btn-language a{
	display:flex;
	align-items:center;
	
	width:calc(100% - 1vw);
	height:11vw;
	border-radius:1.5vw;
	border:solid 0.5vw #e6e6e6;
	font-weight:bold;
	color:#828282;
}
#footer .language.device-sp .language-box .btn-language a .label{
	width:100%;
	display:block;
	text-align:center;
}


/********** ロゴ **********/
#footer .f-logo{
	padding:0 0 0.5vw;
	text-align:right;
}
#footer .f-logo a{
}
#footer .f-logo a img{
	width:30vw;
}

/********** コピーライト **********/
#footer .copyright{
	text-align:right;
	font-size:0.65em;
	color:#B3B3B3;
}




/* --------------------------------------------------------------------------------
	header　英語用
-------------------------------------------------------------------------------- */
/********** ナビゲーション **********/
#header .en-inner .logo {
    width: 58%;
}
#header .en-inner .btn-jp{
	width: 26%;
    padding: 1.8em 0 0.2em;
	background:#fff;
}
#header .en-inner .btn-jp a{
	font-size:3.3vw;
	font-weight:bold;
	color:#7A7A7A;
	background:url(../images/page/en/icon-arr.png) no-repeat 0 30%;
	background-size:18%;
}
#header .en-inner .btn-jp a .label{
	padding:0 0 0 18%;
}


/* --------------------------------------------------------------------------------
	footer　英語用
-------------------------------------------------------------------------------- */

/********** ロゴ **********/
#footer .en-inner .f-logo {
    padding: 0 0 2.5vw;
}



/* --------------------------------------------------------------------------------
	header　英語用
-------------------------------------------------------------------------------- */
/********** ナビゲーション **********/
#header .cn-inner .logo {
    width: 58%;
}
#header .cn-inner .btn-jp{
	width: 26%;
    padding: 1.8em 0 0.2em;
	background:#fff;
}
#header .cn-inner .btn-jp a{
	font-size:3.3vw;
	font-weight:bold;
	color:#7A7A7A;
	background:url(../images/page/cn/icon-arr.png) no-repeat 0 30%;
	background-size:18%;
}
#header .cn-inner .btn-jp a .label{
	padding:0 0 0 18%;
}


/* --------------------------------------------------------------------------------
	footer　英語用
-------------------------------------------------------------------------------- */

/********** ロゴ **********/
#footer .cn-inner .f-logo {
    padding: 0 0 2.5vw;
}