@charset "UTF-8";


/* RESET, COMMON
------------------------------------------------------*/

body, header, footer, nav, section, div, ol, ul, li, p, h1, h2, h3 {
	margin: 0;
	padding: 0;
}

article,aside,canvas,details,figcaption,figure,
header,footer,hgroup,menu,nav,section,summary {
	display: block
}

li {
	list-style: none;
}

p {
	margin: 0 0 1.5em;
}

a {
	-webkit-transition: all 0.1s linear;
       -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
         -o-transition: all 0.1s linear;
            transition: all 0.1s linear;
}

article a:link, article a:visited {
	color: #fe730d;
	text-decoration: none;
}
article a:hover {
	color: #EA1919;
	text-decoration: underline;
}

/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:block;
    overflow:hidden;
}

.cf:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}

/* 代替コンテンツを非表示 */
.LEGACY {
	display: none;
}

/************************************************************
　　　　共通
************************************************************/

body {
	font-family: "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", arial, verdana, Meiryo, "ＭＳ Ｐゴシック", Osaka,  sans-serif;
	font-size: 1em;
	color: #333;
	min-width: 980px;
}

/************************************************************
　　　　PC用
************************************************************/

/*------------------------------------------------------
	ヘッダ
------------------------------------------------------*/
/*@media print, screen and (min-width: 784px){*/
@media print, screen and (min-width: 0px){
a {
	-webkit-transition: all 0.1s linear;
       -moz-transition: all 0.1s linear;
        -ms-transition: all 0.1s linear;
         -o-transition: all 0.1s linear;
            transition: all 0.1s linear;
}

header {
	margin: 10px 0 0;
	font-size: 0.9em;

}

#mainHeader {
	width: 980px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
}

/*	ロゴ
------------------------------------------------------*/
/* （トップ以外） */
#logo {
	background: url(/common/images/logo.svg) no-repeat;
	text-indent: -9999px;
	float: left;
	margin: 26px 0 30px ;
}

/* （トップ） */
#home #logo {
}

#logo a {
	display: block;
	height: 35px;
	width: 235px;
}

/*	言語スイッチ
------------------------------------------------------*/
#langSW {
	position: absolute;
	left: 260px;
	top: 32px;
	font-size: 0.7em;
}

#langSW li {
	float: left;
}

#langSW li + li:before {
	content: "/";
	margin: 0 3px;
	color: #aaa;
}

#langSW li a,
.EN #langSW li.jp a {
	color: #aaa;
	text-decoration: none;
}

#langSW li.jp a {
	color: #000;
}

.EN #langSW li.en a {
	color: #000;	
}

#langSW li a:hover {
	text-decoration: underline !important;
	color: #000 !important;
}

/*	グローバルナビ
------------------------------------------------------*/
#gNav {

}

#gNav ul{
	float: right;
}

#gNav li {
	float: left;
	/*margin: 2px 0 0px 40px;*/
}

.EN #gNav li {
	padding: 0 13px;
}

#gNav .gNtopics {
	width: 146px;
	text-align: left;
}

 .EN #gNav .gNtopics {
	width: auto;
	text-align: center;
}

#gNav .gNabout {
	width: 189px;
	text-align: center;
	padding-left: 0;
}

.EN #gNav .gNabout {
	width: auto;
}

#gNav .gNconcert {
	width: 108px;
	text-align: center;
}

.EN #gNav .gNconcert {
	width: auto;
}

#gNav .gNinstrument {
	width: 70px;
	text-align: center;
}

.EN #gNav .gNinstrument {
	width: auto;
}

#gNav .gNtsunami {
	width: 136px;
	text-align:right;
}

.EN #gNav .gNtsunami {
	width: auto;
	padding-right: 0;
}

#gNav a {
}

#gNav a:link, #gNav a:visited {
	display: block;
	padding: 30px 0 1.5em;
	color: #666;
	text-decoration: none;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

#gNav a:hover {
	opacity: 0.6;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}



/*	ローカルナビ
------------------------------------------------------*/
#lNav {
	width: 100%;
	background: #eee;
	overflow: hidden;
}

#lNavArea {
	width: 616px;
	position: relative;
	left: 50%;
	margin: 0 0 0 -150px;
}

#lNav ul {
	overflow: hidden;
}

#lNav ul::before {
	position: absolute;
	top:-10px;
	content: "";
	border-bottom: 20px solid #eee;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
}

#lNav li {
	float: left;
	position:relative;
}


#lNav a:link, #lNav a:visited {
	display: block;
	padding: 1.7em 1.6em 1.7em 1.6em;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

#lNav a:hover {
	opacity: 0.6;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}



/*------------------------------------------------------
	 フッタ
------------------------------------------------------*/
footer {
	background: #eee;
	position:relative;
	z-index: 1;
}

/*	ページトップボタン
------------------------------------------------------*/
.pageTop {
	position: absolute;
	left: 50%;
	margin-left: -23px;
	z-index: 9999;
}

.pageTop img {
	width: 46px;
	opacity: 0.7;
}

/*	パンくず
------------------------------------------------------*/
#breadcrumb {
	background: #e6e6e6;
	font-size: 0.8em;
	padding: 1.5em 0;
	overflow: hidden;
}

#breadcrumb ul {
	margin: 0 0 0 -490px;
	position: relative;
	left: 50%;
	overflow: hidden;
}

#breadcrumb li {
	float: left;
}

#breadcrumb li:first-child {
	margin-left:-2.1em;
}

#breadcrumb li::before {
	content: ">";
	margin: 0 0.8em;
}

#breadcrumb a:link, #breadcrumb a:visited {
	color: #333;
	text-decoration: none;
}


#breadcrumb a:hover {
	text-decoration: underline;
}

/*	フッタ（ぱんくず以下）
------------------------------------------------------*/
#footerArea {
	width: 980px;
	padding: 20px 0 0;
	margin: 0 auto;
	overflow:hidden;
}

/*	サイトマップ
------------------------------------------------------*/
#linkList {
	margin: 0;
	overflow:hidden;
	float: left;
}

#linkListBox {
	width: 250px;
	float: left;
	font-size: 0.7em;
}

#linkList h1 {
	font-size: 1.2em;
	margin: 0 0 0.5em;
}

#linkList .title {
	font-weight: bold;
}

#linkList ul {
	margin: 0 0 1.5em;
}

#linkList li {
	margin: 0.5em 0 0;
}

#linkList a:link, #linkList a:visited {
	display: inline;
	margin: 0 0 0.5em;
	text-decoration: none;
	color: #333;
}

#linkList a:hover {
	text-decoration: underline;
}

/*	バナーエリア
------------------------------------------------------*/
aside {
	float: right;
}


aside li {
	margin: 0 0 1.5em;
}

aside .bnr a:link, aside .bnr a:visited {
	display: block;
	width: 210px;
	color: #fff;
	font-size: 0.8em;
	text-decoration: none;
	font-weight: bold;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;

}

aside .bnr a:hover {
	opacity: 0.6;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

aside .bnr a span {
	display: block;
	width: 125px;
	padding: 1.5em 0 1.4em 25px;
	position: relative;
	letter-spacing: 0.3em;
}

aside .bnr a span:after {
	content:"";
	position: absolute;
	left:138px;
	top: 50%;
	margin-top: -10px;
	border: 10px solid transparent;
	border-left: 20px solid #becad3;
}


/* コンタクトボタン */
aside .contactBtn a:link, aside .contactBtn a:visited {
	background: url(/common/images/contact_icon.svg) no-repeat 170px center #98aeb9;
	background-size:20px 13px;
}

aside .contactBtn a span {
	background: #becad3;
}

aside .contactBtn a span:after {
	border-left-color: #becad3;
}

/* TSUNAMIボタン */
aside .tnmBtn a:link, aside .tnmBtn a:visited {
	background: url(/common/images/tnm_icon.svg) no-repeat 170px center #dbbba7;
	background-size: 25px 55px;
}

aside .tnmBtn a span {
	background: #e7d2c4;
}

aside .tnmBtn a span:after {
	border-left-color: #e7d2c4;
}


/* facebookボタン */
aside .fbBtn a:link, aside .fbBtn a:visited {
	background: url(/common/images/fb_icon.svg) no-repeat 174px center #819ACD;
	background-size:12px 23px;
}

aside .fbBtn a span {
	background: #BFCDEB;
}

aside .fbBtn a span:after {
	border-left-color: #BFCDEB;
}


/*	コピーライト
------------------------------------------------------*/
small {
	display: block;
	width: 980px;
	text-align: right;
	margin: 0 auto;
	font-size: 0.6em;
	color: #b5b5b5;
}

small a:link, small a:visited {
	color: #b5b5b5;
}

small a:hover {
	text-decoration: none;
}


/*------------------------------------------------------
	コンテンツエリア
------------------------------------------------------*/
#tArea {
	background-color: #eee;
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 20em;
	position: relative;
	max-width: 1980px;
	margin: 0 auto;
}

#tArea h1 {
	left: 50%;
	margin: 0 0 0 -490px;
	position: absolute;
	bottom: 1em;
	font-size: 2em;
	color: #fff;
	font-weight: lighter;
	letter-spacing: 0.3em;
}

.EN #tArea h1 {
	letter-spacing: 0.05em;
}

.inner {
	width: 980px;
	margin: 3.5em auto;
	position: relative;
	display:  none; /* jsで表示させる */
}

.column2 {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	-o-column-count: 2;
	-ms-column-count: 2;
	-moz-column-gap: 50px;
	-webkit-column-gap: 50px;
	-o-column-gap: 50px;
	-ms-column-gap: 50px;
}

.columnL {
	width: 60%;
}

.columnR {
	width: 60%;
	position: relative;
	left: 40%;
}


.center {
	text-align: center;
}

.lead {
	font-size: 1.5em;
	font-weight: lighter;
	color: #999;
	margin-bottom: 1em;
}

article {
	max-width: 1980px;
	margin: 0 auto;
}

.txtLink {
	position: relative;
	margin-left: 10px;
	padding-left: 10px;
}

.txtLink::before {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #aaa;
	border-right: 2px solid #aaa;
	position: absolute;
	top: 50%;
	left: 0;
	margin: -4px 0 0 -10px;
	-webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
}

}
/* PC用 */

/************************************************************
　　　　スマートフォン用
************************************************************/
/*
@media screen and (max-width: 783px){

}
*/