@charset "UTF-8";

/*///////////////共通//////////////////*/
body{	font-family: 'Noto Serif JP';}

header nav a span,
.drawer-menu span,
.tc_main h3 span{    font-family: 'Noto Sans', sans-serif;}

/*****************************************************************************************/
/*   「.」ドットはhtmlのclass  指定したclass名の要素にスタイルを適用するクラスセレクタ      */
/* HTML文書内の　class "example" ←  .example　となり　代入式らしい                        */
/*****************************************************************************************/

/*-start-----------------------------------*/
/* clearfixは、「浮いた要素のバリア機能」     */
/*     で有名な一文らしい                    */
.clearfix::after{  content: "";  display: block;  clear: both;}

/*-start-----------------------------------*/
/*要素の表示形式を決める                     */
/* block は要素の前後に改行が入り縦並びとなる */
.pc, 
.pc_tb{	display:block;}

/*-start-----------------------------------*/
/*要素の表示形式を決める                     */
/* none は指定した箇所を非表示にできる       */
.sp,
.sp_header,
.sp_only{	display:none;}

/*-start-----------------------------------*/
/*  見出し関係の指定 定型文                  */
/*     で有名な一文らしい                    */
h1,
h2,
h3,
h4,
h5,
h6{	font-weight:normal;	}


/*///////////////フェードイン系//////////////////*/
/*  文字列は全部これ使用している？？？　　　　　*/
/*       opacity	      要素の透明度           */
/*       transform       要素の動かし方          */
/*           translateY(50px)  下からフェードイン  */
.fadein {   opacity : 0;  transform: translateY(20px);   transition: all 1s;}

/*------------------    伸びるボーダーたちの説明  ----------------------*/
/*  width  領域の幅   height   要素の高さ                               */
/*  border  - left   左のボーダーライン                                 */
/*          - right  右のボーダーライン                                  */
/*          - top    上のボーダーライン                                 */
/*          - bottom 下のボーダーライン                                 */ 
/*position  ボックスの配置方法（基準位置）を指定                          */
/*   -absolute    包含ブロック（直近の祖先要素でポジショニングされた要素、 */
/*                   もしくはウインドウの内容領域）を基準とした、         */
/*                   絶対位置への配置を指定します。                      */
/*    relative    通常の位置を基準とした、相対位置への配置を指定します。   */
/* 開始位置                                                            */
/*    top       上端からの距離を指定                                    */
/*    left      左端からの距離を指定                                    */
/*    right     右端からの距離を指定                                    */
/*    bottom    下端からの距離を指定                                    */
/*  z-index   ボックスの重なり順序                                      */
/*---------------------------------------------------------------------*/

/*ここでは開始座標とペン種などを設定しているのみで、動かし方は　function.js　に依存*/
/*HTML文書では、     開始座標   動かし方 　をセットにしている*/

/*〇*/
.border_top_1{	width:3px;	height:95%;	border-left:2px solid #7499D1;	position:absolute;	top:0;	left:10px;}
.border_top_2{	width:3px;	height:100%;	border-left:2px solid #7499D1;	position:absolute;	top:0;	left:10px;}
.border_top_3{	width: 3px;    height: 42%;    border-left: 2px solid #7499D1;    position: absolute;    top: 32.5%;    left: 3%;}
.border_top_4{	width:3px;	height:100%;	border-left:2px solid #7499D1;	position:absolute;	top:0;	left:10px;}
.border_top_5{	width:3px;	height:100%;	border-left:2px solid #7499D1;	position:absolute;	top:0;	left: 25.9%;    z-index: -1;}
.border_top_6{	width:3px;	height:55%;	border-left:2px solid #7499D1;	position:absolute;	top:0;	left:120px;	z-index: -1;}
.border_top_7{	width: 3px;    height: 45%;    border-left: 2px solid #7499D1;    position: absolute;    top: 470px;    left: 120px;	z-index: -2;}
.border_top_8{	width: 3px;    height: 65%;    border-left: 2px solid #7499D1;    position: absolute;    top: 15%;    right: 15%;	z-index: -2;}

.border_right_1{	width:65%;	height:3px;	border-top:2px solid #7499D1;	position:absolute;	top:5%;	right:0;}
.border_right_2{	width:60%;	height:3px;	border-top:2px solid #7499D1;	position:absolute;	bottom:10%;	right:0;}
.border_right_3{	width:400px;	height:3px;	border-top:2px solid #7499D1;	position:absolute;	bottom:0%;	right:0;}
.border_right_4{	width:65%;	height:3px;	border-top:2px solid #7499D1;	position:absolute;	top:42%;	right:0;}
.border_right_5{	width: 64%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    top: 25%;	right:0;}
.border_right_6{	width: 81%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 50.5%;    right: 16%	}
.border_right_7{	width: 66%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 60%;    right: 0;}
.border_right_8{	width: 71%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 51%;    right: 0;}
.border_right_9{	width: 55%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 7%;    right: 0;}
.border_right_10{	width:75%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 17%;    right: 0;}

.border_left_1{	width: 64%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    top: 20%;    left: 0;}
.border_left_2{	width: 64%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 29%;    left: 0;}
.border_left_3{	width: 35%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 36%;    left: 0;}
.border_left_4{	width: 65%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    bottom: 33%;    left: 0;}
.border_left_5{	width: 68%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    top: 25%;    left: 0;}
.border_left_6{	width: 60%;    height: 3px;    border-top: 2px solid #7499D1;    position: absolute;    top: 14%;    left: 0;}
.border_bottom_1{	width: 3px;    height: 45%;    border-left: 2px solid #7499D1;    position: absolute;    bottom: 0;    left: 35px;}

/*///////////////トップロゴアニメーション//////////////////*/
.canvas {    width: 228px;    height: 300px;    position: relative;	margin: auto;	padding-top:230px;}

/* htmlのid="○○"とCSSの#○○が一致しているとき、そのhtmlタグにCSSが効く */
#illust {    position: absolute;    top: 230px;    left: 0;	width: 228px;}
#illust {    display: none;}/*トップへ戻るボタン*/
/***********************************************/

/*トップへ戻るボタン*/
.to_top{	position:fixed;	bottom:8%;	right:3%;	}	
.to_top img{	width:65px;	}	
.to_top a:hover{	opacity:.8;	transition:0.4s;	} 

/*ヘッダー*/
/****************************色はここで制御*********************************/
.cb-header {  	position: fixed;    top: 0;    left: 0;    display: none;    z-index: 999;    width: 100%;    background-color: rgba(200, 97, 221, 0.8);}
header nav {  letter-spacing: 1px;  margin: 0;  width: 100%;  margin: auto;}
.header_border{	width:100%;	height:1px;	border-top:1px solid #FFF;}
header nav ul {    padding-left:0;	width: 1080px;    margin: auto;}
header nav ul:nth-child(4) {    padding:15px 0 15px 0;	display: -webkit-flex;    display: flex;    -webkit-justify-content: center;    justify-content: center;    -webkit-align-items: center;    align-items: center;	}		
header nav ul:nth-child(2) li:nth-child(1) {   	width:100px;}
header nav ul:nth-child(2) li:nth-child(2) {   	width:140px;	margin-right:75px;}		
header nav li {    display: inline-block;    text-align: center;	line-height:1;	width: 170px;}
header nav p {    padding-left: 10%;}
header nav img{  vertical-align:middle;}
header nav a {  	color: #FFF;    text-decoration: none;    font-size: 16px;}
header nav a:hover {  	opacity:.5;	transition:0.5s;}
header nav a span{   font-size: 11px;}
header nav ul:nth-child(2){   	text-align:right;	padding:20px 0px 10px 0;	position: relative;}

/**********ハンバーガーメニュー　開始位置*******************************/
.header_logo {	width:1080px;	margin:auto;	position:relative;    z-index: 9999;}

/*****************************************/
.header_logo a{	position: absolute;    left: 85px;    top: 5px;	}
header nav ul:nth-child(2) a span{	font-size:14px;	}
/*ヘッダーここまで*/

/*フッター*/
.about{	width:950px;	margin: 5% auto 5%;	overflow:hidden;	}		
.about_left{	float:left;	width:500px;	}		
.about_right{	float:left;	width:400px;    position:relative;	padding:100px 0 7% 50px;	overflow:hidden;	line-height: 1.15;	}	
.about_right h3{	font-size:24px;	}	
.about_right h4{	font-size:16px;	}	
.about_right p{	font-size:14px;	}
.about_right p:nth-child(5){	font-size:20px;	}		
.about_right p img {    vertical-align: text-bottom;}		
.about_right p:nth-child(5){	font-size:18px;	margin-top:0;	}
.about_right p img{	vertical-align:middle;	}				
.about_right ul{	padding-left:0;}	
.about_right li{	display: inline-block;    font-size: 24px;    padding-right: 30px;	}	
.about_right li a{	text-decoration:none;	color:#000;	transition: .3s;	}	
.about_right li a:hover{	opacity:.5;	}			
.about_right li img{	vertical-align:middle;	float: none;	}

/*フッターボックス*/
.footer_box {    background-color: #13213F;    text-align: center;    padding: 5% 0;}
footer ul{	text-align:center;	padding-left: 0;	}footer li{	display:block;	line-height: 1.8;	}
footer li a{	display:inline-block;	width:170px;	text-decoration:none;	color:#333;	transition: .3s;	line-height: 1.15;	}	
footer li a:hover{	color:#000;	background-color:#FFF;	opacity:1;	}		
.copy {    background-color: #000;    color: #FFF;    text-align: center;    font-size: 14px;	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	padding: 0.3% 0 0.5%;}
.copy ul{	text-align:center;	padding-left: 0;		}		
.copy ul li{	display:inline-block;	}	
.copy ul li:first-child{	margin-right:20px;	}	
.copy ul a{	color:#FFF;	font-weight:bold;	border: 1px solid #FFF;    margin-bottom: 5px;    padding: 7px;	}		
.copy ul a:hover{	opacity:.9;	}		
/*フッターここまで*/

/*///////////////トップページ//////////////////*/



/***********************************************/
/***********************************************/
/***********************************************/
.d_top {    /* background-image: url(../images/描画.png); */
 background-image: url(../images/-main/MAIN_TOP.jpg);		    background-attachment: fixed;		    background-size: cover;	    height: 900px;	    position: relative;		max-width: 100%;				}
/***********************************************/
/***********************************************/
/***********************************************/

.top_main h1 img{	width:100%;	}			
.logo{	position: absolute;    top: 22%;    left: 0;    right: 0;    margin: auto;	width:200px;    z-index: 600;    text-align: center;	}		
.logo img{	width:200px;	}			

.top_content_1, 
.top_content_2, 
.top_content_4, 
.top_content_5{	width:1080px;	margin:auto;	position:relative;		overflow: hidden;	}	

.top_link{	display: block;	position: absolute;	top: 0;	left: 0;	height:100%;	width: 100%;	z-index:99;	transition:0.4s;}
.top_link:hover{	background-color: rgba(255, 255, 255, 0.2);}	
.top_content_3{	width:1080px;	margin:auto;	position:relative;}	
.top_content_1{	margin-bottom:60px;	}		
.top_content_2{	padding-bottom:290px;}			
.top_content_3{	margin-bottom:210px;	}			

/*-start--------------------------*/
/*  縦書きのレイアウトを指定している */
.content_1_right, 
.content_2_left, 
.content_3_right, 
.content_4_left, 
.content_5_left, 
.content_7_right, 
.content_8_left, 
.content_10_right, 
.content_11_right, 
.content_12_right, 
.content_12_left_2{	-webkit-writing-mode: vertical-rl;      -ms-writing-mode: tb-rl;          writing-mode: vertical-rl;		  }			  

.content_1_left{    padding-left: 8%;    padding-top: 20%;    width: 50%;    padding-bottom: 5%;	line-height:2;	}	
.content_1_left img{	width:100%;	}		
.content_1_right{	position: absolute;	left: 65%;	top: 8%;	}	

.content_1_right p, 
.content_2_left p, 
.content_3_right p, 
.content_4_left p, 
.content_7_right p, 
.content_8_left p, 
.content_10_right p, 
.content_11_right p, 
.content_12_left_2 p{	font-size:20px;	line-height: 1.5em;	}	

.top_content_5 p{	font-size:18px;	line-height: 1.15;}		

.content_1_right h2, 
.content_2_left h2, 
.content_3_right h2, 
.content_4_left h2, 
.top_content_5 h2, 
.content_7_right h2, 
.content_8_left h2, 
.content_10_right h2, 
.content_11_right h2, 
.content_12_right h2, 
.content_12_left_2 h2{	font-size:64px;	font-weight:500;	line-height: 1.2em;    margin: 0;	}

.top_page .content_2_left h2{		background-color:#FFF;	}	
.content_2_left{	float: left;	}	
.content_2_right{	position: absolute;    right: -5%;    top: 16%;    width: 80%;	}	
.content_2_right img{	width: 100%;	}		
.content_3_right{	float:right;	padding-right:3%;	}	
.content_3_left{	position: absolute;    left: -8%;    width: 75%;	}	
.content_3_left img{	width:100%;	}		
.content_4_left{	float:left;	}	
.content_4_right{	padding-top: 5%;    float: right;    padding-bottom: 10%;	}	
.content_4_right img{	width:100%;	}			
.google-maps {	position: relative;	padding-bottom: 25%; 	height: 0;	overflow: hidden;}
.google-maps iframe {	position: absolute;	top: 0;	left: 0;	width: 100% !important;	height: 100% !important;}	
.map{	width:100%;	margin:auto;	text-align:center;	background-color:#000;	}	
.map img{	width:80%;	margin:auto;	}
 
/*////////////////////////////////*/
.music_top {    		background-image: url(../images/0-music/0-0.jpg);	    	background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.english_top {			background-image: url(../images/1-english/1-0.jpg);	    	background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;		background-position: center;	}
.english_contents{		text-align:right;																																														}
.english_contents p{	-webkit-writing-mode: vertical-rl;	      -ms-writing-mode: tb-rl;	          writing-mode: vertical-rl;		display:inline-block;		padding-left:10px;											}
.english_contents img{	display:inline-block;		vertical-align: baseline;																																					}
.drum_top {			    background-image: url(../images/2-drum/2-0.jpg);	    	background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.koto_top {			    background-image: url(../images/3-koto/3-0.jpg);	    	background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.performance_top {	    background-image: url(../images/4-performance/4-0.jpg);		background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.access_top {		    background-image: url(../images/5-access/5-0.jpg);		    background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
/*
.access_top {		    height: 600px;			background-position: center;		margin-bottom: 8%;					background-attachment: scroll;																			}
*/
.facility_top {		    background-image: url(../images/6-facility/6-0.png);	    background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.price_top {		    background-image: url(../images/7-price/7-0.jpg);		    background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}
.information_top {	    background-image: url(../images/8-information/8-0.jpg);	    background-attachment: fixed;	    background-size: cover;	    height: 900px;	    position: relative;										}

 

/*/////////////////////////////////*/
.text {    width: 950px;    margin: auto;	margin-top:100px;}
.text p{	line-height: 2.5em;    width: 700px;    margin: auto;    margin-bottom: 5%;}
.text table {    border-collapse: collapse;    border: none;	margin: auto;    width: 800px;	margin-bottom: 15%;}
.text table td{	border: none;    padding: 25px 0;    border-top: 1px solid #DEDEDE;	border-bottom: 1px solid #DEDEDE;	}	
.text table td:nth-child(1){	text-align: left;    padding-right: 50px;    width: 130px;	padding-left: 100px;	vertical-align:top;	font-weight:400;	font-size: 17px;	line-height:1.15;	}	
.text table td:nth-child(2){	padding-left:50px;	padding-right:50px;	line-height:1.7em;	}	
.top_content_5{	width:1080px;	margin:auto;	position:relative;	margin-top:100px;}
.content_5_left{	position: absolute;    top: 0;    left: 0;}	
.top_content_6{	width:1080px;	margin:auto;	position:relative;		padding-top: 100px;	text-align:right;	margin-bottom:120px;;	}		
.top_content_6 p{	float:right;}.top_content_6 p:nth-child(2){	padding-top: 250px;    padding-right: 30px;    line-height: 1.5em;}



/*/////////////////////////////////*/

.top_content_7, 
.top_content_8{	width:1080px;	margin:auto;	position:relative;	margin-bottom:100px;	overflow: hidden;}

.top_content_10, 
.top_content_11, 
.top_content_12{	width:1080px;	margin:auto;	position:relative;	overflow: hidden;}	

.top_content_10,
.top_content_11{	margin-top:8%;	}

.content_7_left p, 
.content_8_right p, 
.content_7_right_c p,
.content_10_right_2 p,
.content_10_left p:nth-child(3),
.content_10_left p:nth-child(4), 
.content_11_right_2 p:nth-child(2), 
.content_11_right_2 p:nth-child(3), 
.content_12_left p, 
.content_12_right_2 p{	display:inline-block;	line-height: 2;}

.content_7_left {    padding-left: 5%;    padding-top: 30%;}
.content_7_right {    position: absolute;    top: 15%;    right: 5%;}
.border_box{	width:100%;	position:relative;	overflow:hidden;}
.border_box_big{	width: 1080px;    position: relative;    overflow: hidden;    margin: auto;}
.content_8_right{	text-align:right;	padding:8% 3% 0 0 ;	}
.content_7_right_c{	padding-top:15%;	text-align:right;}
.content_8_left{	position:absolute;	top:0;	left:1%;	z-index: 100;    background-color: #FFF;	z-index:1;}
.content_8_right_b{	text-align:right;}
.content_7_left_b{	position:absolute;	top:0;	left:7%;}
.content_7_left_b h2{	font-size:64px;	font-weight:500;	line-height: 1.2em;	margin-top:0;}
.content_7_left_b p{	font-size:20px;	line-height: 1.5em;	margin-bottom:0;}
.content_8_right_b p{	margin:0;	margin-bottom: 5px;	}

/*/////////////////////////////////*/

.content_1_right h5,
.content_7_right h5, 
.content_10_right h5{	font-size: 16px;    line-height: 1.5em;} 

.top_content_9{	width:810px;	margin: 7% auto 0;}
.content_9_left{	float:left;}


.about_right h3 {	margin-top:0;}
.access_page .text {    margin-bottom: 5%;	margin-top:3%;}
.access_page .text {    margin-top:0px;}

/*/////////////////////////////////*/


.content_10_right h5 {    line-height: 1.8em;    padding-top: 15px;}
.content_8_left h2 span{	font-size:13px;	}	


.content_10_right{	position:absolute;	right:0;	top:0;	}	
.content_11_right{	position:absolute;	right: 60px;	top:0;	background-color:#FFF;	}	
.content_11_right_2{	text-align:right;	padding: 60px 70px 0px 0px;}
.content_11_right_2 p:nth-child(2){	padding-right:3%;}
.content_11_left{	line-height:2;	position:relative;	padding: 60px 0 0 130px;}
.content_11_left p:nth-child(2){	position:absolute;	top:480px;}	
.content_10_left p:nth-child(1){	margin-top:0;}		
.content_10_left p:nth-child(2){	padding-top:60px;}
.content_10_left p:nth-child(3){	padding-top:280px;	}
.content_10_right_2{	position:absolute;	right: 0;    bottom: 400px;	}	
.content_10_right_2 p{	text-align:right;	}	
.content_10_right_2 p:nth-child(1){	position: absolute;    left: -245px;    bottom: 0;}	
.content_12_left{	padding-top:100px;}
.content_12_right{	position:absolute;	right:20%;	top:0;}
.content_12_right_2{	text-align:right;	padding-top: 100px;}
.content_12_right_2:nth-child(5) {    padding-top: 200px;}
.content_12_right_2 .content_12_p{	padding-bottom:2%;}
.content_12_left_2{	position:absolute;	left: 10%;    bottom: 20%;}
.content_7_p, .content_12_p{	width:400px;    line-height: 1.5em;    padding-left: 3%;}
.content_10_p{	padding-left:3%;}

.content_8_p, 
.content_12_p{	width:400px;    line-height: 1.5em;    padding-right: 3%;}

/*/////////////////////////////////*/
.br{	line-height:3;}

/*/////////////////////////////////*/
/*/////////////////////////////////*/
#pageplugin {margin: 0 auto;max-width: 500px;}

.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{    width: 100% !important;}


@media screen and ( max-width:1280px){
/*///////////////トップ、ヘッダー、フッター//////////////////*/
.pc{	display:none;}
.sp{	display:block;}
.sp_header{	display:inline;}
header nav a span {    font-size: 10px;}

.logo {    top: 24%;}
.canvas {   	padding-top:160px;}
#illust {    top: 160px;}

.top_content_1, 
.top_content_2, 
.top_content_3, 
.top_content_4, 
.top_content_5 {    width: 80%;}

.content_7_left p, 
.content_8_right p, 
.content_7_right_c p, 
.content_10_right_2 p, 
.content_10_left p:nth-child(3), 
.content_10_left p:nth-child(4), 
.content_11_right_2 p:nth-child(2), 
.content_11_right_2 p:nth-child(3), 
.content_12_left p, 
.content_12_right_2 p {    line-height: 1.5;}

.top_content_1 {    margin-bottom: 0;}
.top_content_3 {    margin-bottom: 10%;}
.border_right_1 {    width: 70%;    top: 20%;   }     
.border_bottom_1 {    left: 3%;}
.top_page .content_3_right {    padding-right:0;}
.top_content_2{    margin-top: 8%;    padding-bottom: 10%;}

.content_1_right h2, 
.content_2_left h2, 
.content_3_right h2, 
.content_4_left h2, 
.top_content_5 h2, 
.content_7_right h2, 
.content_7_left_b h2, 
.content_8_left h2,  
.content_10_right h2, 
.content_11_right h2, 
.content_12_right h2, 
.content_12_left_2 h2{    font-size: 4.2vw;}

.content_1_right p, 
.content_2_left p, 
.content_3_right p, 
.content_4_left p, 
.top_content_5 p, 
.content_7_right p, 
.content_7_left_b p, 
.content_8_left p, 
.content_10_right p, 
.content_11_right p, 
.content_12_left_2 p{    font-size: 2vw;}

.content_1_left {    padding-top: 10%;    width: 55%;}
.content_1_right {    padding-right: 0;    position: absolute;    left: 68%;}
.content_2_right {    position: absolute;    right: -5%;    padding-top: 10%;}
.content_2_left{	padding-bottom: 20%;	}
.content_3_left {    width: 80%;	left: -10%;}
.content_4_right {    padding-top: 10%;    width: 60%;}
.google-maps {    padding-bottom: 40%;}
.about {    width: 70%;}
.about_left {    width:500px;	float:none;	margin:auto;}	
.about_right {    float: none;     width: 100%;    margin: auto;    text-align: center;	padding-left: 0;    padding-top: 80px;}

footer li {    width: 180px;	margin:auto;	line-height: 2;    }	
footer li a {    font-size: 16px;}.border_right_3 {    width: 100%;    }		

/*トップへ戻るボタン*/	
.to_top img{	width:50px;	}

/*/////////////////////////////////*/
.border_top_5 {    left: 10%;   }   

/*/////////////////////////////////*/
.border_box_big {    width: 100%;    position: relative;    overflow: hidden;    margin: auto;}
.border_top_3 {    left: 6%;}
.border_right_6 {    bottom: 49%;	right: 13%;    }

.content_7_left p, 
.content_7_right_c p:nth-child(2){    width: 53%;	font-size: 14px;}

.content_7_left p:nth-child(2), 
.content_7_right_c p{    width: 22%;}
.content_7_left img, 
.content_8_right img, 
.content_7_right_c img,
.content_8_right_b img, 
.content_8_right_c img {    width: 100%;}

.content_8_right p{    width:22%;	font-size:14px;}
.content_8_right p:nth-child(2) {    width:53%;}
.content_8_right_c p{	width:75%;	float: right;	margin:0;}
.content_8_right_b p:nth-child(2){	float:right;	width:50%;	padding:0;}
.border_top_3 {    height: 63%;    top: 12.6%;    left: 8%;}
.border_right_6 {    width: 92%;    bottom: 50.5%;    right: 0%;}

/*/////////////////////////////////*/

.content_7_right h5, 
.content_10_right h5 , 
.top_content_5 {    margin-top: 11%;}
.border_top_4 {    left: 0;}
.border_right_7 {    width: 75%;    }

.text table td {    border-bottom: none;	}

/*/////////////////////////////////*/	
.content_1_left p{    font-size: 14px;}
.text p {    width: 80%;    text-align: center;}
.text table {    border-collapse: collapse;    border: none;    margin: auto;    width: 80%;}


/*/////////////////////////////////*/	

.top_content_9 {    width: 100%; }
.content_9_left {    float: none;    width: 400px;    margin: 0 auto 3%;}
.content_9_left img {    width: 100%;}

.text {    width: 100%;    margin: auto;    margin-top: 100px;}
.text table td:nth-child(1) {    text-align:center;    display: block;    width: 100%;	     padding-right: 0;      padding-left: 0; 	 font-size:15px;}
.text table td:nth-child(2) {    width: 100%;    text-align: center;	display:block;	padding-left: 0;    padding-right: 0;	font-size:14px;}

.top_content_6 {    width: 85%;}.top_content_6 p {    width: 400px;}
.top_content_6 img {    width: 100%;}
.top_content_6 p:nth-child(2) {    width: 230px;    position: absolute;	bottom:5%;	left:0;}


.top_content_10, 
.top_content_11, 
.top_content_12 {    width: 90%;	margin-top: 10%;  }   

.content_10_left p:nth-child(1) {    margin-top: 0;    width: 60%;}
.content_10_left img {    width:100%;}
.content_10_left p:nth-child(2) {    padding-top: 5%;    width: 35%;}
.content_10_left p:nth-child(3) {    padding-top: 20%;    width: 55%;}
.content_10_left p, 
.content_11_right_2 p, 
.content_12_right_2 p, 
.content_12_left p{	font-size:1.5vw;	}

.content_10_right_2 {	width:35%;    bottom: 33%;}
.content_10_right_2 p:nth-child(2) {	width:100%;}
.content_10_right_2 p img {    width:100%;}
.content_10_right_2 p:nth-child(1) {    left: -70%;    font-size: 1.5vw;}
.border_top_7 {    top: 28%;    left: 10%;}
.content_11_left {    padding: 6% 0 0 5%;}
.content_11_right {    right: 5%;}
.content_11_left p:nth-child(1){	width:60%;	}	
.content_11_left p:nth-child(1) img{	width:100%;	}
.content_11_right_2 {	padding:25% 0 0;	}
.content_11_right_2 p:nth-child(1){	width: 40%;    position: absolute;    right: 0;    top: 39%;	}	
.content_11_right_2 p:nth-child(3){	width:60%;	}	
.content_11_right_2 img{	width:100%;	}	
.border_left_4 {    bottom: 44%;    }	
.content_11_left p:nth-child(2) {    position:static;	font-size:1.7vw;}


.content_12_right_2 p:nth-child(2){	width:50%;}
.content_12_right_2 p:nth-child(1){	width:40%;}
.content_12_right_2 img{	width:100%;}
.content_12_left {    padding-top: 13%;}
.content_12_left p:nth-child(1){	width:50%;}
.content_12_left p:nth-child(2){	width:40%;}
.content_12_left img{	width:100%;}
.content_12_right_2 {    padding-top: 6%;}
.content_12_right_2:nth-child(5) {    padding-top: 22%;}
.content_12_left_2 {    left: 7%;    bottom: 20%;}
.border_left_6 {    width: 70%;    top: 20%;   }   


/*/////////////////////////////////*/
@media screen and (max-width: 1080px){	header nav ul {    width: 100%;}
header nav a {    font-size:15px;}
.header_logo a {    left: 10px;}
header nav ul:nth-child(2) li:nth-child(2) {     margin-right: 0; }
header nav li {    width: 16.5%;}
}




@media screen and ( max-width:600px){
/*///////////////トップ、ヘッダー、フッター//////////////////*/	
.df_top {    height: 600px;	width:100%;	background-attachment:scroll;    background-size: cover;	background-position: -120px center;}	
.cb-header {    padding-top: 3px;}
.sp_only{	display:block;}
.pc_tb{	display:none;}
.sp_header img{    width: 100%;}
header nav ul:nth-child(4),
.header_border  {    display: none;}
header nav ul:nth-child(2) {    padding-top: 52px;}
.header_logo {    position: fixed;	top: 3px;}
header nav li {    display: inline-block;    text-align: left;    line-height: 1;    float: left;	width: 20%;	padding: 0px 0 0 7px;}
header nav li:nth-child(2) {    width: 30%;	}
header nav ul:nth-child(2) li:nth-child(1) {    width: 90px;	padding-left: 10px;}
header nav ul:nth-child(2) li:nth-child(2) {    padding-right: 10px;    width: 150px;} 
.top_page .content_1_right, 
.top_page .content_2_left, 
.top_page .content_3_right, 
.top_page .content_4_left {      -webkit-writing-mode: horizontal-tb;      -ms-writing-mode: lr-tb;          writing-mode: horizontal-tb;}
.logo img {    width: 160px;}
.logo {    top: 20%;}
header nav a {    font-size: 14px;	font-weight:400;}
.header_logo a {    left: 10px;}
.header_logo img {    width:230px;}
.top_content_1, 
.top_content_2, 
.top_content_3, 
.top_content_4, 
.top_content_5 {    width: 100%;}
.top_content_1 {    margin-bottom: 11%;}
.top_content_2 {    padding-bottom: 44%;}
.top_content_1 {    margin-bottom: 11%;}
.content_1_left {    padding-top: 43%;    width: 85%;    padding-left: 4%;}
.top_page .content_1_right{	padding-right: 0;    position: absolute;    left: 30%;    bottom: 64%;    width: 65%;	text-align:right;}
.content_1_right h2, 
.content_2_left h2, 
.content_3_right h2, 
.content_4_left h2, 
.top_content_5 h2, 
.content_7_right h2, 
.content_7_left_b h2, 
.content_8_left h2, 
.content_10_right h2, 
.content_11_right h2, 
.content_12_right h2, 
.content_12_left_2 h2, 
.event_midashi h2 {    font-size: 7.5vw;}
.content_1_right p, 
.content_2_left p, 
.content_3_right p, 
.content_4_left p, 
.event_txt p, 
.content_7_right p, 
.content_7_left_b p, 
.content_8_left p, 
.content_10_right p, 
.content_11_right p , 
.content_11_right p, 
.content_12_left_2 p, 
.event_midashi p {    font-size: 3.5vw;    margin: 0;}
.content_7_left_b p{	margin:0;}
.top_content_5 p{	font-size:3.5vw;	margin:0;}
.content_2_left {    padding-left: 6%;}
.content_2_right {	padding-top: 12%;	width: 85%;}
.content_3_left {    padding-top: 35%;    width: 90%;}
.top_content_3 {    margin-bottom: 33%;}
.top_page .content_3_right{	width: 59%;	text-align:right;	padding-right: 3%;}
.top_page .top_content_4{	padding-top:25%;}
.content_4_right {    padding-bottom: 0;    padding-top: 41%;    width: 80%;    margin-right: 3%;}
.content_4_left {    position: absolute;    top: 27%;    left: 3%;}
.top_event {    margin-top: 15%;}
.about {    margin: 15% auto 5%;	width:100%;}
.about_left {    width:85%;	margin:auto;}
.about_right {    padding-top: 10%;}
.about_right h3 {       font-size: 17px;    font-weight: 400;}
.about_right h4 {    font-size: 14px;    line-height: 1;    font-weight: 100;}
.about_right ul {    padding-left: 0;    padding: 3% 0 3px 0;}
.about_right li {    display: block;    font-size: 19px;    padding-right:0;}
.about_right p {    font-size: 14px;    line-height: 1.5;}
footer li a {    font-size: 14px;	width:100%;}
footer ul {    margin: 0;}
footer li {    width: 180px;	padding:2% 0 ;    margin: auto;	display: block;	line-height:1;}
.footer_box img {    width: 110px;}
.copy ul {    text-align: center;    padding: 3% 0 0 0;	font-size:14px;}
.copy ul li:first-child {    margin: 0 auto;}
.copy ul li {    display: block;}
.copy {    font-size: 12px;    }	
.border_bottom_1 {    left: 5%;}
.border_right_2 {    width: 85%;    bottom: 8%;    }	
.border_right_3 {    width: 100%;    bottom: 3%;    }		
.map img {    width: 100%;}	
/*/////////////////////////////////*/
.logo img {    width: 160px;}	
/*/////////////////////////////////*/	
.border_top_2 {    left: 0%;}
.border_left_1 {    top: 24%;   }
.border_right_5 {    top: 15%;    }	
.border_right_6 {    display: none;}
.border_top_3 {    left: 80%;    top: 43%;    height: 27%;}
.top_content_7, 
.top_content_8 {    width: 95%;	margin-bottom:10%;}
.content_7_left p, 
.content_7_right_c p:nth-child(2) {    width: 85%;    font-size: 3.5vw;}
.content_7_left p:nth-child(2), 
.content_7_right_c p {    width: 65%;	margin:0;}
.content_7_left_b {    left: 3%;}
.content_7_right_c {    padding-top: 25%;}
.content_8_right_b {    padding-top: 19%;}
.content_8_right {    padding-top: 20%;}
.content_8_right p {    width: 55%;    font-size: 3.5vw;	margin: 0 0 5% 0;}
.content_8_right p:nth-child(2) {    width: 75%;}
.content_8_right_c{	margin-bottom:5%;}
/*/////////////////////////////////*/	
.border_left_2 {    bottom: 45%;    }	
.content_7_right h5 {    font-size: 2.8vw;	font-weight:400;}
/*/////////////////////////////////*/
.content_1_left p {    font-size: 3.5vw;}
.top_content_6 {    width: 100%;    padding:0;	margin-bottom: 25%;}
.top_content_6 p {    width: 75%;}
.text p {    font-size: 14px;    line-height: 2;}
.top_content_6 p:nth-child(2) {    position: absolute;    left: 6%;    bottom: -28%;	font-size:14px;    text-align: left;}
/*/////////////////////////////////*/
/*/////////////////////////////////*/
.access_top {    margin-bottom: 12%;    background-attachment: scroll;    height: 500px;}
.content_9_left {    width: 70%;    margin: 0 auto 3%;}
.access_page .logo {    top: 25%;}
.access_page .logo img {    width: 160px;}
.google-maps {    padding-bottom: 70%;}	
/*/////////////////////////////////*/	
.information_top {	height: 500px;    background-attachment: scroll;	background-position: right;}
.information_page .logo {    top: 25%;}
.information_page .logo img {    width: 160px;}
.top_content_10, 
.top_content_11, 
.top_content_12 {    width: 95%;}
.information_page .content_7_right {    right: 0;	top:4%;	}
.information_page .content_7_left {    padding-top: 68%;}
.information_page  .content_8_right {    padding-top: 40%;}
.information_page .content_7_left p:nth-child(2) {    width: 100%;    display: block;    line-height: 1.5;    font-size: 3.5vw;}
.information_page .content_8_right p {    width: 100%;    font-size: 3.5vw;}
.information_page .content_7_left {    padding-top: 55%;}
.information_page .top_content_7:nth-child(2) .content_7_right {    right: 6%;    top: 6%;}
.information_page .content_7_right h5, 
.content_10_right h5{    font-size: 2.7vw;    font-weight: 400;	padding-top:0;}
.content_8_left h2 span {    font-size: 10px;}
.content_10_left p:nth-child(1) {    width: 100%;    padding-top: 55%;}
.content_10_left p:nth-child(2) {    padding-top: 3%;    width: 55%;}
.content_10_left p:nth-child(3) {    padding-top: 70%;    width: 75%;	margin-bottom:0;}
.content_10_right_2 {    width: 65%;    bottom: 27.1%;}
.content_10_right {    left: 5%;    top: 4%;    -webkit-writing-mode: horizontal-tb;    -ms-writing-mode: lr-tb;    writing-mode: horizontal-tb;}
.content_10_right_2 p:nth-child(1) {    right: 0;    font-size: 3.5vw;    top: 83%;    line-height: 1.5;}
.content_10_left p:nth-child(4){	font-size:3.5vw;	line-height:1.5;	margin-top:5px;	}	
.content_11_left p:nth-child(1) {    width: 70%;}
.content_11_left p:nth-child(2) ,
.content_11_right_2 p:nth-child(2){    font-size: 3.5vw;	line-height:1.5;	margin-bottom:0;}
.content_11_right_2 p:nth-child(1) {    width: 50%;    right: 5%;    top: 47%;}
.content_11_right_2 {    text-align: left;	padding: 38% 0 0 3%;}
.content_11_right_2 p:nth-child(3) {    width: 70%;}
.content_12_right {    right: 6%;}
.content_12_left p:nth-child(1), 
.content_12_right_2 p:nth-child(2) {    width: 70%;}
.content_12_left p:nth-child(2), 
.content_12_right_2 p:nth-child(1){    width: 90%;    font-size: 3.5vw;    line-height: 1.5;    margin: 0 auto;	padding-bottom:0;}
.content_12_left_2 {    bottom: 15%;}
.content_12_right_2 {    padding-top: 11%;}
/*/////////////////////////////////*/
.border_top_1,
.border_top_2,
.border_top_3,
.border_top_4,
.border_top_4,
.border_top_5,
.border_top_6,
.border_top_7,
.border_top_8,
.border_right_1,
.border_right_2,
.border_right_3,
.border_right_4,
.border_right_5,
.border_right_6,
.border_right_7, 
.border_right_8, 
.border_right_9,
.border_right_10,
.b_bottom_1,
.b_left_1,
.b_left_2,
.b_left_3,
.b_left_4,
.b_left_5,
.b_left_6{	display:none;	}	
/*///////////////トップロゴアニメーション//////////////////*/
.canvas {    width: 160px;	padding-top:110px;    }	
#illust {    width: 160px;    top: 110px;}
}/*///////////////ここから先はテスト//////////////////*/