@charset "UTF-8";
/*---------------------------------------------
	フォント
  ---------------------------------------------*/
@import url("../plugins/font-awesome/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');

/* -----------------------------------
    汎用クラス
   ----------------------------------- */
body {
	font-size: 62.5%;
	color: #000;
	line-height: 1.6;
	position: relative;
	text-align: justify;
	font-feature-settings:"palt";
	font-family: "游ゴシック",YuGothic,"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	background-color: #ffffff;
}
body p,body li,body table,dt,dd{ 
	font-size: 16px; 
	text-justify: inter-ideograph;}
a { text-decoration: none; transition: all 0s}
a:link {color: #000000;}
a:visited {color: #000000;}
a:hover {color: #00509e; transition: all 0.3s linear;text-decoration: none }
a:active { color: #000000; }
img{width: 100%}

.text-bold{font-weight: bold !important;}
.text-right {text-align: right !important;}
.text-left {text-align: left !important;}
.text-center,
.text-center__pc{
	text-align: center !important;
	margin-left: auto;
	margin-right: auto;
}
span.text-sup,
span.text-sub{
	font-size: 75.5%;
	vertical-align: top;
	position: relative;
	top: -0.03em;
	padding-left: 1px;
	padding-right: 1px;
}
span.text-sub {
	vertical-align: bottom;
	top: 0.03em;
}
a.underLine,
span.underLine{ text-decoration: underline; }

.mt-0px { margin-top: 0px !important; }
.mt-5px { margin-top: 5px !important; }
.mt-10px { margin-top: 10px !important; }
.mt-15px { margin-top: 15px !important; }
.mt-20px { margin-top: 20px !important; }
.mt-30px { margin-top: 30px !important; }
.mt-40px { margin-top: 40px !important; }
.mt-50px { margin-top: 50px !important; }
.mt-80px { margin-top: 80px !important; }
.mt-100px { margin-top: 100px !important; }
.mb-0px { margin-bottom: 0px !important; }
.mb-10px { margin-bottom: 10px !important; }
.mb-20px { margin-bottom: 20px !important; }
.mb-30px { margin-bottom: 20px !important; }
.mb-50px { margin-bottom: 50px !important; }
.mb-80px { margin-bottom: 80px !important; }
.mb-100px { margin-bottom: 100px !important; }
.ml-20px { margin-left: 20px !important; }
.mr-20px { margin-right: 20px !important; }
.ml-mr-5px { margin-left: 5px !important; margin-right: 5px !important; }
.ml-mr-10px { margin-left: 10px !important; margin-right: 10px !important; }
.ml-mr-20px { margin-left: 20px !important; margin-right: 20px !important; }
.ml-mr-50px { margin-left: 50px !important; margin-right: 50px !important; }
.margin-15px{margin: 15px !important}
.pt-0px { padding-top: 0px !important; }
.pt-10px { padding-top: 10px !important; }
.pt-15px { padding-top: 15px !important; }
.pt-30px { padding-top: 30px !important; }
.pt-50px { padding-top: 50px !important; }
.pb-0px { padding-bottom: 0px !important; }
.pb-15px { padding-bottom: 15px !important; }
.pb-30px { padding-bottom: 30px !important; }
.pl-10px { padding-left: 10px !important; }
.pl-20px { padding-left: 20px !important; }

.width1em { width: 1em !important; }
.width2em { width: 2em !important; }
.width3em { width: 3em !important; }
.width4em { width: 4em !important; }
.width5em { width: 5em !important; }
.width6em { width: 6em !important; }
.width7em { width: 7em !important; }
.width8em { width: 8em !important; }
.width9em { width: 9em !important; }
.width10em { width: 10em !important; }
.width11em { width: 11em !important; }
.width12em { width: 12em !important; }
.width13em { width: 13em !important; }
.width14em { width: 14em !important; }
.width15em { width: 15em !important; }
.width20em { width: 20em !important; }
.width25em { width: 25em !important; }
.width30em { width: 30em !important; }
.width40em { width: 40em !important; }
.width50em { width: 50em !important; }
.width15per { width: 15% !important; }
.width35per { width: 35% !important; }
.width50per { width: 50% !important; }
.width80per { width: 80% !important; }
.width90per { width: 90% !important; }
.width100per { width: 100% !important; }
.width-auto { width: auto !important; }

.display-block{display: block!important}

@media screen and (max-width: 680px) {
body p,body li,body table { 
	font-size: 15px; 
}
.text-center__pc{text-align: left!important}	
}

/* --- Clear Fix ------------- */
.clearfix:before, .clearfix:after {
	display: table;
	content: " ";
}
.clearfix:after {clear: both;}
.clearfix {overflow: hidden;}
*, *::after, *::before {
	box-sizing: border-box;
}

/* -----------------------------------
   フォーム
 * ----------------------------------- */
input,
select,
label {
	vertical-align: baseline;
}

.br-pc{display: inline !important}
.br-sp{display: none !important}
.img-pc{display: block !important}
.img-sp{display: none !important}
@media screen and (max-width: 640px) {
.br-pc{display: none !important}
.br-sp{display: inline !important}	
.img-pc{display: none !important}
.img-sp{display: block !important}	
}

/*---------------------------------------------
	メインコンテンツ
  ---------------------------------------------*/
.container-main,
.container-main-1200,
.container-main-1100,
.container-main-wide,
.container-main-850{
	width: 800px;
	margin: 0px auto;
}
.container-main{min-height: 300px;}
.container-main-02{min-height: 400px}
.container-main-1200{width: 1200px}
.container-main-1100{width: 1100px}
.container-main-wide{width: 960px}
.container-main-850{width: 850px}
.width-720{
	width: 720px;
	margin: 0px auto;
}
@media screen and (max-width: 1200px) {
.container-main-1200{width: 90%}	
}
@media screen and (max-width: 1100px) {
.container-main-1100{width: 90%}	
}
@media screen and (max-width: 920px) {
.container-main,
.container-main-wide{width: 90%;}
}
@media screen and (max-width:880px) {
.container-main{min-width: 90%;}	
.container-main-850{width: 90%;}	
}
@media screen and (max-width: 768px) {
.width-720{width: 100%;}	
}

/* -----------------------------------
    メニュー
   ----------------------------------- */
input.hamburger {display: none;}
h1 a{
	width: 220px;
	height: 50px;
    display: flex;
    align-items: center;
	padding-left: 10px
}
#navigation li a span{font-family: 'Roboto Condensed', sans-serif;}
#link-banner-top{
    width: 100%;
    text-align: center;
    border-top: 1px solid #00509e;
    padding-top: 8px;
    padding-bottom: 5px;
}
@media screen and (min-width: 769px) {
#menu{
    background-color: rgba(255,255,255,0.80);
    backdrop-filter: blur(5px);
    width: 100%;
    height: 60px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
    z-index: 6;
}	
#menu-inner{
	height: 60px;
	max-width: 1200px;
	margin: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap
}	
.drawer-list{
    display: flex;
    justify-content: space-between;
    align-items: center;
	flex-wrap: wrap;
    padding-left: 5px;
    padding-right: 5px;
}		
#navigation{
	display: flex;
    justify-content: space-between;
	align-items: center;
	width: 550px;
}
#navigation li{
	display: flex;
	align-items: center;
	text-align: center;
}	
#navigation li small{font-size: 13px;}	
#navigation li a span{
    display: inline-block;
    font-size: 18px;
}
#navigation li a.active,
#navigation li.active a,	
#navigation li:hover:after,
#navigation li a:hover{
	color: #00509e;
}	
#navigation li.sp-menu{display: none}
a.menu-nolink{pointer-events: none;}
li.menu__mega:hover a.menu-nolink{color: #00509e;}	

/*メガメニュー*/
.menu__mega__inner{
	display: none;
	position: absolute;
	top: 60px;
    left: 0;
    width: 100%;
	height: 100vh;
	background-color: rgba(0,80,158,0.95);
    z-index: 5;
}
.menu__mega .menu__mega__list {
    width: 750px;
	height: 100%;
    margin: 20px auto auto;
}
.menu__mega .menu__mega__list > li{display: inline-block!important}
.menu__mega .menu__mega__list > li a {
	display: block !important;
    color: #ffffff !important;
	padding: 10px 20px;
}
.menu__mega .menu__mega__list > li a:before{
	content: "▶";
	font-size: 10px;
	padding-right: 3px
}
.menu__mega .menu__mega__list > li a.active,	
.menu__mega .menu__mega__list > li a:hover {color: #FFFD00 !important;}
.menu__mega .menu__mega__list ul {padding-left: 15px}
#link-banner-top li {
	width: 280px;
	display: inline-block;
}	
#link-banner-top li + li{margin-left: 30px;}	
#link-banner-top li a{
    display: block;
    line-height: 0;
}	
#link-banner-top{
    margin-top: 60px;
}	
}	
@media screen and (max-width: 768px) {
#menu{height: 50px}
.drawer-list ul#navigation{
    width: 90%;
    margin: 5px auto auto;
    padding-bottom: 50px;
}	
.drawer-list {
	position: fixed;
	right: 0;
	top: 0;
	height: 100vh;
	width: 100vw;
	transform: translate(100vw, 0);
	transition: width 475ms ease-out, transform 450ms ease, border-radius .8s .1s ease;
	background-color: #00509e;
	z-index: 10;
	overflow: scroll;
}
.drawer-list ul#navigation li {
    pointer-events: auto;
    transform: translatex(100vw);
    border-bottom: 1px solid rgba(255,255,255,0.15);
}
.drawer-list ul#navigation li.sp-menu{display: block}	
.drawer-list ul#navigation li a {
	padding: .4rem 10px;
	color: #ffffff;
	display: block;
	font-size: 18px
}
.drawer-list ul#navigation li a.active,
.drawer-list ul#navigation li a:hover{color: #fffc00}
#navigation li.sp-menu{display: block}	
/*メガメニュー*/	
.menu__mega__list{padding-left: 16px}
.menu__mega .menu__mega__list li{border-bottom: none !important}	
.menu__mega .menu__mega__list > li a {
	font-size: 16px !important
}
.menu__mega .menu__mega__list ul {padding-left: 15px}	
.drawer-list ul#navigation li.menu__mega a.menu-nolink:after{
	font-family: 'FontAwesome';
	content: "\f107";
	display: inline-block;
	padding-left: 15px;
}	
	
input.hamburger:checked ~ .drawer-list,
input.hamburger:checked ~ .drawer-list #navigation li {
  transform: translatex(0);
}
label.hamburger {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 9999;
	display: block;
	height: 50px;
	width: 50px;
	background-color: #00509e;
}
label.hamburger:hover {cursor: pointer;}
label.hamburger > i {
	position: absolute;
	width: 30px;
    height: 2px;
    top: calc(50% - 2px);
    left: 10px;
	background-color: #ffffff;
	transition-duration: .35s;
	transition-delay: .35s;
}
label.hamburger > i:before,
label.hamburger > i:after {
	content: "";
	position: absolute;
	width: 30px;
    height: 2px;
	left: 15px;
	background-color: #ffffff;
	transition: transform 0.35s;
	transform-origin: 50% 50%;
}
	
label.hamburger > i:before {
	top: 15px;
	transform: translate(-50%, -25px);
	background-color: #ffffff;
}
label.hamburger > i:after {
	bottom: 15px;
	transform: translate(-50%, 25px);
}

input.hamburger:checked ~ label > i {
  background-color: transparent;
  transform: rotate(90deg);
}
input.hamburger:checked ~ label > i:before {
	transform: translate(-50%, -50%) rotate(315deg);
	left: 15px;
    top: 0px;
	background-color: #ffffff;
}
input.hamburger:checked ~ label > i:after {
	transform: translate(-50%, -50%) rotate(-315deg);
	left: 15px;
	top: 0px;
	background-color: #ffffff;
}
input.hamburger:checked ~ label close {
  color: #FEFEFE;
  width: 100%;
}
input.hamburger:checked ~ label open {
  color: rgba(0, 0, 0, 0);
  width: 0;
}
#link-banner-top li {
	width: 250px;
	display: block;
	margin: auto
}	
}

/*---------------------------------------------
	カラム
  ---------------------------------------------*/
body section:first-of-type {padding-top: 0}
section {
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}
.container-flex {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap
}
.container-flex-center {
	display: flex;
	justify-content: center;
	flex-wrap: wrap
}
.container-flex-left {
	display: flex;
	flex-wrap: wrap
}
.align-center{align-items: center !important}
.align-end{align-items: flex-end}
.block-column {margin-bottom: 100px;}
.block-wide {width: 85% !important}
.block-half {width: 48.5% !important}
.block-medium {width: 65% !important}
.block-small {width: 30% !important}
.block-20per {width: 20% !important}
.block-25per {width: 25% !important}
.block-33per {width: 33% !important}
.block-40per {width: 46.5% !important}
.block-60per {width: 53.5% !important}
.block-70per {width: 70% !important}
.block-75per {width: 75% !important}
.block-200px {width: 200px !important}
.block-150px {width: 150px !important}
.block-125px {width: 125px !important}
.block-100px {width: 100px !important}
.margin-auto{
	margin-left: auto;
	margin-right: auto;
}
.flex-all{flex: 1 0 100%}
.line-height{line-height: 0!important}
.bg-color{background-color:#ebf6f6 }
.bg-red{background-color:#FF0000 }
.bg-gray {
    background-color: #ebebeb;
    padding-top: 40px !important;
    padding-bottom: 30px !important;
}
.block-image-border {
    border: 1px solid #CCCCCC;
}

.bg-gray h4.title-02 {
	width: 95%;
	margin: auto;
	background-color: #00519e;
}
.bg-gray h5{
	font-size: 25px;
	font-weight: bold;
	color: #00519e;
	text-align: center
}
.container-box + .container-box{
    margin-top: 80px;
    margin-bottom: 80px;
	border-top: 1px dotted #BCC0D7;
	padding-top: 80px
}
.panel img{
    box-shadow: 3px 3px 3px rgb(0 0 0 / 15%);
	line-height: 0
}
.block-txt{width: calc(100% - 180px)}
.block-image{width: 150px}
.inner-btn{
    width: 600px;
    margin: 10px auto auto
}
.img-shadow {filter: drop-shadow(2px 2px 2px rgba(160, 160, 160, 0.8));}
@media screen and (max-width: 768px){
body > section:first-of-type {padding-top: 0px;}
.sp-reverse{flex-direction: column-reverse}	
}
@media screen and (max-width: 640px){
.block-wide,
.block-half,
.block-medium,
.block-small,
.block-15per,
.block-33per,
.block-70per,
.block-75per{width: 100% !important}	
.block-20per,
.block-25per{width: 50% !important}    
.block-200px {margin: auto}	
#list-stu .block-150px,
#list-stu .block-125px {width: 50% !important}
.block-column {margin-bottom: 60px;}
.block-small#about-logo{width: 60% !important}	
.panel{margin-bottom: 10px}
.block-txt{width: 100%}	
.block-image{margin: 10px auto auto}
.inner-btn{width: 90%}	
.inner-btn li{
	margin-bottom: 10px;
	text-align: center;
}	
}

/*---------------------------------------------
	見出し
  ---------------------------------------------*/
h2.title{
	font-size: 28px;
	margin-bottom: 35px;
	background-color: #00509e;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #ffffff;
	font-family: 'Roboto Condensed', sans-serif;
}
h2.title-sub{
	font-size: 26px;
	margin-bottom: 50px;
	color: #00509e;
	text-align: center;
	font-weight: bold
}
h2.title-sub:before,
h2.title-sub:after{content: " — "}
h2.no-title{
	padding-top: 0;
	padding-bottom: 0;
	height: 5px
}
h2.title-02 {
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    margin-top: 40px;
    margin-bottom: 15px;
	border-bottom: 1px solid rgba(255,255,255,0.50);
	display: inline-block
}
h3.title{
	font-size: 24px;
	margin-bottom: 35px;
	position: relative
}
h3.title:before,
h3.title:after{
	content: "";
	position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
	height: 3px;
	width: 50px;
	background-color: #00509e;	
}
h3.title:before{}
h3.title:after{
	width: 25px;
	background-color: #929292;
	left: 25px
}
h3.title small{
	font-size: 18px;
	display: block;
	margin-bottom: 10px
}
h4.title{
	font-size: 20px;
	margin-bottom: 10px;
}
h4.title-02{
    background-color: #00509e;
    color: #ffffff;
    font-size: 22px;
    margin-bottom: 10px;
    text-align: center;
    padding: 5px;
    font-weight: bold;
}
h5.title{
	font-size: 18px;
	margin-bottom: 10px;
	margin-top: 30px;
	line-height: 1.4
}
h5.title-02{
	text-align: left;
	border-bottom: 1px solid #00509e;
}
h5.title-02 small{
	display: block;
	font-size: 85%
}
h6.title{
	font-size: 17px;
	margin-bottom: 10px;
	font-weight: bold
}
h6.title-02{
    background-color: #00509e;
    color: #ffffff;
    font-size: 17px;
    padding: 5px 10px;
    margin-bottom: 5px;
}
h6.title-02-2{
	text-align: center
}
h6.title-02-2 span{
	display: inline-block;
	background-color: #00509e;
    color: #ffffff;
    font-size: 17px;
    padding: 5px 10px;
    margin-bottom: 5px;
}
h6.title-03{
    font-size: 17px;
    font-weight: bold;
    margin-top: 10px;
    border-bottom: 1px dotted #999999;
}
h6.title-04{
    color: #00509e;
    font-size: 16px;
    padding: 5px 10px;
	border: 1px solid #00509e
}
.title{
	color: #00509e;
	font-weight: bold;	
	text-align: center;
}

.box-red{
    background-color: #FF0000;
    color: #FFFFFF;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
}
.box-red p{
	font-weight: bold;
    font-size: 20px;
    text-align: center;
}
.box{
    border: 1px solid #000000;
    padding: 15px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.text-blue{color: #00509e !important;}
.text-black{color: #000000 !important;}
.text-wh{color: #ffffff !important;}
.text-mincho{font-family: 'Shippori Mincho', serif;}
.text-mincho-l{
	font-weight: bold;
	font-size: 50px;
}
.text-mincho-m{
	font-weight: bold;
	font-size: 40px
}
.text-13px {font-size: 13px !important }
.text-15px {font-size: 15px !important }
.text-small {font-size: 0.85em; display: inline-block; }
.text-large{font-size: 18px !important}
.text-24px {font-size: 24px !important }
.text-caption,
.text-caption li,
li.text-caption{
	font-size: 13px !important;
	line-height: 1.2
}
.text-indent, li.text-indent {
    padding-left: 1em;
    text-indent: -1em;
}
.text-theme{
	font-family: 'Shippori Mincho', serif;
	font-size: 20px;
	font-weight: bold;
	color: #00509e;
}
.t-external-link a{
	color: #00509e;
}
.t-external-link a:after{
    font-family: 'FontAwesome';
    content: "\f08e";
    margin-left: 3px;
}
@media screen and (max-width: 768px) {
h2.title-sub{font-size: 24px;}	
h3.title{font-size: 22px;}	
h4.title{font-size: 18px;}	
}
@media screen and (max-width: 680px) {
h2.title {
    font-size: 25px;
	margin-bottom: 30px;
	padding-top: 10px;
    padding-bottom: 10px}	
h2.title-sub{font-size: 22px;}	
h3.title,
h4.title-02{font-size: 20px;}
.text-24px {font-size: 20px !important }
.text-mincho-l{font-size: 35px;}
.text-mincho-m{font-size: 28px}	
}


/*---------------------------------------------
	リスト
  ---------------------------------------------*/
.container-event{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.container-event .block-text{width: 70%}
.container-event .block-photo{width: 25%}	
.container-event .block-text h2{
	font-size: 20px;
	color: #00509e;
    font-weight: bold;
	margin-bottom: 10px
}
.container-event .block-text h2 a{
	color: #00509e;
	display: inline-block;
}
.container-event .block-text h2 a span{font-size: 18px;}
.container-event .block-text h2 a.text-link:before {background-color: rgba(0,80,158,0.50);}
.container-event .block-text dt{margin-top: 5px;}
.container-event .block-text dd{margin-left: 1em;}
#close{
	background-color: #e9e9e9;
	padding-top: 0px;
	margin-top: 70px
}
#close > section{padding-bottom: 0px;}
#close .container-event .block-text h2{font-size: 19px;}
#close .container-event .block-text h2:before{
	content: "終了しました";
	display: inline-block;
	font-size: 13px;
	background-color: #00509e;
	color: #ffffff;
	padding: 2px 1px 0px 0px;
	margin-bottom: 2px;
	width: 80px;
	text-align: center;
	margin-right: 5px;
}
#close .container-event .block-text h2.chushi:before{
	content: "中止になりました";
	width: 100px;
}
#close .container-event .block-text h2:before{
	content: "終了しました";
	display: inline-block;
	font-size: 13px;
	background-color: #00509e;
	color: #ffffff;
	padding: 2px 1px 0px 0px;
	margin-bottom: 2px;
	width: 80px;
	text-align: center;
	margin-right: 5px;
}
.block-text h2.chushi:before{
	content: "中止になりました";
	width: 100px;
	display: inline-block;
	font-size: 13px;
	background-color: #00509e;
	color: #ffffff;
	padding: 2px 1px 0px 0px;
	margin-bottom: 2px;
	text-align: center;
	margin-right: 5px;
}
@media screen and (max-width: 680px) {
.container-event .block-text{width: 100%}
.container-event .block-photo{
	width: 60%;
	margin: 20px auto 0px;
}		
}
@media screen and (max-width: 580px) {
.container-event .block-photo{width: 100%;}		
}

#event section#close {
	padding: 50px;
	padding-bottom: 50px;
	margin-top: 0
}

.dl-event{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.dl-event dt{
	width: 90px;
	margin-top: 0px !important;
	margin-bottom: 3px;
	padding-bottom: 3px;
	text-align:justify;
	text-align-last:justify;
}
.dl-event dt.dt-full{
	width: 100%;
	text-align: left !important;
	text-align-last:left;
}
.dl-event dd{
	width: calc(100% - 100px);
	margin-left: 0 !important;
}
.dl-event dt.title{
	flex: 1 0 100%;
	text-align: left;
	text-align-last: left;
	font-size: 18px
}
.dl-event-dtWide dt{width: 115px;}
.dl-event-dtWide dd{width: calc(100% - 125px);}
.dl-event-wide dt{
    width: 100%;
    text-align: left;
    text-align-last:left;
    margin-bottom: 0;
    padding-bottom: 0
}
.dl-event-wide dd{
    width: 100%;
    margin-bottom: 15px;
}
a:hover .dl-event dt,
a:hover .dl-event dd{color: #000000;}
@media screen and (max-width: 680px) {
.dl-event dt,
.dl-event dd{width: 100%;}	
.dl-event dt{
	margin-bottom: 0px;
	padding-bottom: 0px;
	text-align: left;
    text-align-last: left;
}	
.dl-event dd{margin-bottom: 5px}
}

.photo-list li{width: 16%}
.photo-list-02 li{
    width: 31.5%;
    line-height: 1.3;
    margin-bottom: 10px;
    font-size: 14px;
}
@media screen and (max-width: 768px) {
.photo-list li{width: 48% !important}	
}

/* -----------------------------------
    お知らせ
   ----------------------------------- */
#list-news-outer{
	height: 500px;
	overflow-y: scroll	
}
.list-news li{
	margin-top: 30px;
	margin-bottom: 30px;}
.list-news li {
	/*display: flex;
	justify-content: space-between;
	flex-wrap: wrap;*/
	text-align: left;
	position: relative
}
.list-news li:first-child{margin-top: 0px;}
.list-news li a:after {
	font-family: 'FontAwesome';
	content: "\f101";
	position: absolute;
	right: 0px;
	top: 0;
    bottom: 0;
    height: 20px;
    margin: auto;
}
.list-news li span.data {display: block}
.list-news li h3.entryTitle{}
.list-news li h3.entryTitle a{
	display: block;
	padding-right: 15px;
}
.list-news li h3.entryTitle a:before{
	position: absolute;
	bottom: -1px;
	right: 0;
	content: '';
	width: 100%;
	height: 1px;
	background-color: rgba(51,51,51,0.50);
	transform: scale(1, 1);
	transform-origin: right top;
	transition: transform .3s;
}
.list-news li h3.entryTitle a:hover::before {transform: scale(0, 1);}
.list-news li h3.entryTitle a:hover{color: #00509e;}
.list-news li h3.entryTitle span.span{
	background-color: #00509e;
	color: #ffffff;
	font-size: 85%;
	padding: 3px;
	margin-left: 5px;
}
.list-news li h3.entryTitle a.text-link{
    display: inline-block;
    margin-right: 20px;
}
.list-news li span.close {
    display: inline-block;
    background-color: #00509e;
    color: #ffffff;
    font-size: 85%;
    padding: 0px 5px;
    margin-right: 5px;
}
@media screen and (max-width: 680px) {
.list-news li h3.entryTitle,
.list-news li h3.entryTitle a:before,
.list-news li span.data{
	width: 100%;
}	
.list-news li h3.entryTitle{
	margin-top: 5px;
	margin-bottom: 10px;
	padding-right: 15px;
}	
}

/* -----------------------------------
    googleMap
   ----------------------------------- */
.map,
.map2,
.map3{
	height: 350px;
	width: 100%;
	margin-top: 20px;
}
.map iframe,
.map2 iframe,
.map3 iframe{
  width: 100% !important;
  height: 100% !important;
  border: none !important;
}
.map2,
.map3{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap
}
.map2 > div{width: 48%}
.map3 > div{width: 32%}
@media screen and (max-width:860px) {
.map,
.map2,	
.map3{
	width: 100%;
}	
}
@media screen and (max-width:768px) {
.map2{height: 720px;}	
.map3{height: 1080px;}	
.map2 > div,
.map3 > div{
	width: 100%;
	margin-bottom: 10px;
}	
}

/*---------------------------------------------
	リンク
  ---------------------------------------------*/
.btn-container{
	margin-top: 50px;
	text-align: center;
	display: block;
	margin-left: auto;
    margin-right: auto;
}
a.btn {
	display: inline-block !important;
	color: #00509e;
	background-color: #ffffff;
	border: 1px solid #00509e;
	font-size: 18px;
	text-align: center;
	padding-right: 1.8rem;
	padding-left: 0.9rem;
	transition: all .3s;
	height: 80px;
	line-height: 80px;
	position: relative;
	border-radius: 40px;
	min-width: 250px;
}
a.btn-350{width: 350px}
a.btn-2{
	line-height: 1.2;
	padding-top: 18px;
	min-width: 350px
}
a.btn-gray{background-color: #D5D5D5}
a.btn:hover{
	background-color: #00509e;
	color: #ffffff;
	border: 1px solid #ffffff;
}
a.btn:after,
a.btn-external:after{
	font-family: 'FontAwesome';
	content: "\f105";
	position: absolute;
	right: 15px;
	top: 0;
    bottom: 0;
    height: 80px;
    margin: auto;
	line-height: 80px
}
a.btn-external:after{content: "\f08e";}
a.btn:hover:after,
a.btn-external:hover:after{
	animation: slide ease-in .6s infinite alternate forwards;
}
a.icon-mail:after,
a.icon-pdf:after{
	font-family: 'FontAwesome';
	content: "\f1d8"
}
a.icon-pdf:after{
    content: "\f1c1";
    padding-left: 5px;
}
a.btn-nolink{
	pointer-events: none;
	padding-right: 1.3rem;
}
a.btn-nolink:after{content: none}
a.btn-red {
	color: #ffffff;
	background-color: #FF0000;
	border: 1px solid #FF0000;
}
img.img-link:hover{
	transform: translateY(-3px);
	box-shadow: 0 6px 5px -3px rgba(0,0,0,.3);
	transition: transform .3s;
}
@keyframes slide {
    0% {right: 20px;}
    100% {right: 10px;}
}

.list-link {margin-top: 15px}
.list-link li a {
	margin-top: 5px;
	margin-bottom: 5px;
	display: inline-block;
}
a.text-link{
	color: #000000;
	position: relative;
	padding-right: 1em
}
a.text-link:before {
    position: absolute;
    bottom: -1px;
    right: 0;
    content: '';
    width: 100%;
    height: 1px;
    background-color: rgba(51,51,51,0.50);
    transform: scale(1, 1);
    transform-origin: right top;
    transition: transform .3s;
}
a.text-link:hover{color: #00509e}
a.text-link:hover::before{transform: scale(0, 1);}
a.text-link:after {
	font-family: 'FontAwesome';
	content: "\f101";
	position: absolute;
	padding-left: .5em
}
@media screen and (max-width: 680px) {
a.btn {
	width: 95% !important;
	font-size: 16px;
}	
a.btn-wide{
	line-height: 1.4;
	padding-top: 1em;
}	
a.btn-wide:after{
    height: 20px;
}	
}
@media screen and (max-width: 375px) {
a.btn {
	font-size: 15px;
	padding-left: 0;
	padding-right: 1.2rem
}	
a.btn-350 {width: 95%;}	
a.btn-2 {min-width: 95%;}
}

.btn-anchor{
	display: flex;
	justify-content: center;
	margin-top: 50px;
	margin-bottom: 50px
}
.btn-anchor li{
	margin-left: 15px;
	margin-right: 15px;
}
.btn-anchor li a{
	display: block;
    color: #00509e;
    background-color: #ffffff;
    border: 1px solid #00509e;
    font-size: 17px;
    text-align: center;
    padding-right: 2.5rem;
    padding-left: 1.3rem;
    transition: all .3s;
    height: 80px;
    line-height: 80px;
    position: relative;
    border-radius: 10px;
	width: 200px;
}
.btn-anchor li a:after {
    font-family: 'FontAwesome';
    content: "\f103";
    position: absolute;
    right: 15px;
    top: 0;
    bottom: 0;
    height: 80px;
    margin: auto;
}
.btn-anchor li a:hover:after{
	animation: icondown ease-in .6s infinite alternate forwards;
}
@keyframes icondown {
    0% {bottom: 0;}
    100% {bottom: -10px;}
}
@media screen and (max-width: 680px) {
.btn-anchor li{
	margin-left: 5px;
	margin-right: 5px;
}	
.btn-anchor li a{
	font-size: 16px;
	 height: 60px;
    line-height: 60px;
	width: 160px;
	padding-right: 1.5rem;
    padding-left: 1rem;
}	
.btn-anchor li a:after {height: 60px;}	
}

/*---------------------------------------------
	フォーム
  ---------------------------------------------*/
#form-main{margin-top: 50px}
#form-main h4{
	text-align: left;
	color: #000000;
	font-size: 18px;
}
.mfp_rows input[type="text"],
.mfp_rows input[type="email"]{
	height: 40px;
	border: 1px solid #00509e;
	padding-left: 5px;
}
.mfp_element_text,
.mfp_element_number,
.mfp_element_select-one,
.mfp_element_email,
.mfp_element_tel,
.mfp_element_textarea,
.mfp_element_date,
.mfp_element_password {
    border: 1px solid #00509e;
    border-radius: 0px;
    box-shadow: none;
    padding: 0;
    margin: 0;
    vertical-align: middle;
}
#form-main textarea{border: 1px solid #00509e;}
.mailform{margin-bottom: 20px}
form#mailformpro dl dt{
	color: #000000;
	font-size: 16px;
	font-weight: bold;
	float: left;
	padding: 20px 20px 20px 0px;
	width: 25%;
	text-align: left;
	border-top: none;
	position: relative
}
form#mailformpro dl dt span{
	font-size: 85%;
	display: block
}
form#mailformpro dl dd{
	padding: 20px 0px 20px 0px;
	width: calc(100% - 25%);
	float: right;
	border-top: none;
}
.must {
    display: block;
    background-color: transparent;
    border: none;
    text-shadow: none;
    padding: 0;
    font-size: 14px;
    color: #000000;
    float: none;
    border-radius: 0px;
    box-shadow: none;
    background-image: none;
}
.mfp_colored {background-color: #ffffff;}
.mfp_element_textarea{
	border: 1px solid #00509e;
	height: 80px !important}
.mfp_buttons button{
	background: #00509e;
	color: #ffffff;
	font-size: 20px;
	width: 200px;
	height: 60px;
	border: none;
	text-shadow: none;
	margin-top: 60px;
}
.mfp_buttons button span{
	font-size: 13px;
	display: block
}
.mfp_element_submit:hover,.mfp_element_reset:hover,.mfp_element_button:hover,button.mfp_next:hover,button.mfp_prev:hover {
	background: gradient(linear, center top, center bottom, from(#00509e), to(#e50012));
	background: -webkit-gradient(linear, center top, center bottom, from(#e50012), to(#e50012));
	background: -moz-linear-gradient(top, #e50012, #e50012);
	background: -ms-linear-gradient(top, #e50012 0%, #e50012 100%);
	box-shadow: none
}
.mfp_buttons button#mfp_button_cancel{background-color: #999999}
@media screen and (max-width: 768px) {
#form-main{padding: 25px}	
form#mailformpro dl dt,
form#mailformpro dl dd{width: 100%}	
form#mailformpro dl dt{padding: 0}	
form#mailformpro dl dd{padding: 10px 0px 30px}		
input.form-control[type=text] {width: auto;}	
}

/*---------------------------------------------
	テーブル
  ---------------------------------------------*/
.wrap_scroll_table {
    width: 100%;
    overflow-x: scroll;
    margin: 0 auto;
}
.tbl-basic{
    width: 100%;
    border-left: 2px solid #ffffff;
    border-right: 2px solid #ffffff;
    margin-top: 10px;
    margin-bottom: 10px;
}
.tbl-basic td,
.tbl-basic th{
	padding: .5em 8px;
	border: 1px solid #CECECC;
	vertical-align: middle;
	font-size: 15px;
	line-height: 1.4
}
.tbl-basic th{
	background-color: #e4f7ff;
	text-align: center;
}
tr.tr-bg,
td.td-bg{
	background: #f6f9fa;
}
.th-center td{text-align: center}
/*横スクロール*/
.scroll-x {
	overflow-x: auto;
	overflow-y: hidden
}
/*SP横スクロール*/
.scroll_table{
    width: 100%;
	border-collapse: separate;
    border-spacing: 10px 10px;
}
.scroll_table th,
.scroll_table td{
    vertical-align: middle;
    font-size: 14px;
	width: 22.5%
}
.scroll_table th{
    text-align: center;
    background-color: #e4f7ff;
	width: 80px;
	font-weight: bold;
	padding: 10px 10px 10px 0px;
}
.scroll_table td{
    border-bottom: 1px solid #00509e;
    border-right: 1px solid #00509e;
    padding: 10px 5px;
}
.scroll_table td a{
	color: #00509e;
	font-weight: bold;
}
.scroll_table.tbl_schedule th:nth-child(1),
.scroll_table.tbl_schedule td:nth-child(1){width: 8%}
.scroll_table.tbl_schedule th:nth-child(2),
.scroll_table.tbl_schedule th:nth-child(3),
.scroll_table.tbl_schedule td:nth-child(2),
.scroll_table.tbl_schedule td:nth-child(3){width: 17%}
.scroll_table.tbl_schedule th:nth-child(4),
.scroll_table.tbl_schedule th:nth-child(5),
.scroll_table.tbl_schedule td:nth-child(4),
.scroll_table.tbl_schedule td:nth-child(5){width: 27%}
.scroll_table.tbl_schedule th{
    padding: 10px 0px;
}
.scroll_table.tbl_schedule td a{position: relative}
.scroll_table td a:after {
    font-family: 'FontAwesome';
    content: "\f101";
    padding-left: 0.5em;
}
.scroll_table td a.link-external:after {
    font-family: 'FontAwesome';
    content: "\f08e";
    position: absolute;
    padding-left: 0.5em;
}
@media screen and (max-width: 768px) {	
.scroll_table,
.wrap_scroll_table > table{
    width: 1000px !important;
    margin-bottom: 20px;
}	
.scroll_table.tbl_schedule{border-spacing: 5px 5px;}	
.scroll_table.tbl_schedule th:nth-child(1),
.scroll_table.tbl_schedule td:nth-child(1){width: 9%}
.scroll_table.tbl_schedule th:nth-child(2),
.scroll_table.tbl_schedule th:nth-child(3),
.scroll_table.tbl_schedule td:nth-child(2),
.scroll_table.tbl_schedule td:nth-child(3){width: 21%}
.scroll_table.tbl_schedule th:nth-child(4),
.scroll_table.tbl_schedule th:nth-child(5),
.scroll_table.tbl_schedule td:nth-child(4),
.scroll_table.tbl_schedule td:nth-child(5){width: 26%}	
}

/*---------------------------------------------
	フッター
  ---------------------------------------------*/
footer{
	padding-top: 50px;
	padding-bottom: 50px;
	border-top: 1px solid #00509e;
	color: #00509e
}
footer h2{
	width: 250px;
	margin: 0px auto 15px;
}
#footer-info{
	width: 370px;
	margin: auto
}
#footer-info li{
	line-height: 1.8
}
span.footer-link a{
	margin: 15px 20px 0px;
	display: inline-block;
	color: #00509e
}
span.footer-link a:hover{color: #000000}
footer span.t-left{
	width: 60px;
	display: inline-block
}
#footer-info li#footer-link{text-align: center}
@media screen and (max-width: 680px) {
footer h2{width: 240px;}
#footer-info{width: 90%;}	
}

/* -----------------------------------
    TELリンク
   ----------------------------------- */
span.tel-number a,
.tel-number a,
.tel-number{
	color: #ffffff !important;
	text-decoration: none;
}
a[href^="tel:"]{color: #000000!important}
@media screen and (min-width: 768px){
a[href^="tel:"]{ pointer-events: none;}
}

/* -----------------------------------
    罫線
   ----------------------------------- */
hr{
	height: 0;
	margin: 0;
	padding: 50px 0px 0px;
	border-left: 0;
	border-right: 0;
	border-top: 0;
	border-bottom: 3px double #AAAAAA
}
hr.hr-dotted{
	height: 0;
	margin: 0 0 50px;
	padding: 50px 0px 0px;
	border-left: 0;
	border-right: 0;
	border-top: 0;
	border-bottom: 1px dotted #BCC0D7
}

/* -----------------------------------
    ページトップ
   ----------------------------------- */
#page-top {
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 50px;
	height: 50px;
	border: 1px solid #0055aa;
	background-color: #ffffff;
	color: #0055aa;
	line-height: 45px;	
	font-size: 3em;
	text-align: center;
	display: block;
	z-index: 1;
	transition: opacity 1s;
}
#page-top:after {
	font-family: 'FontAwesome';
	content: "\f106"
}
@media screen and (max-width: 680px){
#page-top {bottom: 0px;}	
}

/* -----------------------------------
    アニメーション
   ----------------------------------- */
.fuwa,
.fuwa2{opacity: 0}

.anime-fuwa {animation: fuwatAnime .85s ease .2s forwards;}
@keyframes fuwatAnime {
 0% { opacity: 0; 
	 transform: translateY(30px); }
 100% { opacity: 1; 
	 transform: translateY(0px); }
}

.anime-fuwa2 {animation: fuwatAnime .5s ease .5s forwards;}
@keyframes fuwatAnime {
 0% { opacity: 0; 
	 transform: translateY(30px); }
 100% { opacity: 1; 
	 transform: translateY(0px); }
}

/* -----------------------------------
    フォーム
   ----------------------------------- */
.container-fluid .contents{
    max-width: 100%;
    margin: 20px 0 auto;
    padding: 0;
    box-shadow: none
}
h2.form-h2{
    font-weight: bold;
    font-size: 22px;
    margin-top: 50px;
    margin-bottom: 20px;
    background-color: #00519e;
    padding: 2px 15px;
    color: #ffffff;
    border-radius: 6px;
}
h3.form-h3{
    font-weight: bold;
    font-size: 20px;
    display: inline-block;
    margin-top: 30px;
    margin-bottom: 10px;
    color: #00519e;
    width: 100%;
	border-bottom: 2px solid #00519e;
}
h3.form-h3 span{
	font-size: 16px
}
.txt-bold {
    font-weight: bold;
    font-size: 16px;
}
.form-group{font-size: 16px}
.form-group-inner input[type="text"]{
	width: 80px;
	display: inline-block
}
#form-info .form-fieldset.form-fieldset-text,
#form-info .form-fieldset.form-fieldset-phone-split,
#form-info .form-fieldset.form-fieldset-email,
#form-info .form-fieldset.form-fieldset-address-zip-split,
#form-info .form-fieldset.form-fieldset-date{
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#info-list input.form-control[type=text],
#info-list input.form-control.form-email{
	width: 100% !important}
#form-info legend{
	width: 230px;
	line-height: 1.4;
}
#form-info .form-group.form-fieldgroup,
#form-info .form-fieldset.form-fieldset-email .form-group,
#form-info .form-fieldset-address-zip-split .d-flex{width: calc(100% - 240px)}
#form-info .form-fieldset.form-fieldset-email .form-group .form-group.form-fieldgroup{width: 100%}
.form-label-radio-checkbox:not(.form-matrix-option), .form-control-file{border: none}
.optional legend:after {display: none}
.contents.form-fieldset-position-column .form-fieldset{flex-wrap: wrap}
legend{
	font-weight: bold;
    font-size: 18px;
    display: inline-block;
}
legend span{
    font-weight: normal;
    font-size: 14px;
}
.form-group-inner {
    text-indent: -10px;
    border-bottom: 1px dotted #666666;
    margin-top: 5px;
    padding-bottom: 10px
}
span.form-group-inner-small{
    font-size: 14px;
    margin-left: 20px;
}
.block-genbutsu label{
	font-weight: bold;
    font-size: 18px;
}
#form-info .block-genbutsu legend{width: 100%}
#form-info .block-genbutsu .form-group.form-fieldgroup{width: 100%}

input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block{width: 200px;}
.btn-default{
    background: #00509e;
    color: #ffffff;
    font-size: 20px;
    width: 200px;
    height: 60px;
    border: none;
    text-shadow: none;
    margin-top: 60px;
	border-radius: 0;
	padding: 0;
	margin: auto
}
.txt-red{color: #e53935}
.red-box{
    background-color: #e53935;
    color: #ffffff;
    padding: 2px 5px;
    margin: 0 3px;
}
#form a.text-link:after {
    padding-left: 1.2em;
}
@media screen and (max-width: 768px){
#form-info legend,
#form-info .form-group.form-fieldgroup,
#form-info .form-fieldset.form-fieldset-email .form-group,
#form-info .form-fieldset-address-zip-split .d-flex{width: 100%}
.form-control-last{width: 150px !important}
#form-info legend{line-height: 2}
span.form-group-inner-small{
	display: block;
	margin-left: 0px;
}	
}


/* -----------------------------------
    協賛
   ----------------------------------- */
#sponsor{
	padding-top: 30px;
	margin-bottom: 50px;
	padding-bottom: 0;
	border-bottom: 1px solid #00509e;
}
#sponsor h2{
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    color: #00509e;
}
#sponsor-list h3.title-sub{
	font-size: 26px;
	color: #00509e;
	text-align: center;
	font-family: 'Shippori Mincho', serif;
}
#hf{
	padding-top: 0;
	padding-bottom: 0
}	
.list-sponsor{
    max-width: 1200px;
    margin: 30px auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 30px 0;
}
.list-sponsor li{
    margin: 15px 3%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
	font-size: 22px;
}
.list-sponsor.list-a2 li {margin: 15px 2%;}
.list-sponsor.list-a1 li{
	width: 28%;
	font-size: 45px;
}
.list-sponsor.list-a1 li.logo-s{width: 16%}
.list-sponsor.list-a1 li.logo-m{width: 18%}
.list-sponsor.list-a1 li.logo-l{width: 33%}
.list-sponsor.list-a1 li.logo-wide{width: 45%;}
.list-sponsor.list-a1 li.docomo{width: 23%;}
.list-sponsor.list-a2 li{width: 13%;}
.list-sponsor.list-a2 li.logo-wide{width: 27%;}
.list-sponsor.list-a2 li.logo-wide-2{width: 30%;}
.list-sponsor.list-a2 li.logo-medium{width: 19%;}
.list-sponsor.list-a2 li.logo-medium-s{width: 16%;}
.list-sponsor.list-a2 li.logo-small{width: 13%;}
.list-sponsor.list-a2 li.logo-small-s{width: 11%;}
.list-sponsor.list-a3 li{margin: 15px 1.5%;}
.list-sponsor li a{
    display: block;
    width: 100%;
	text-align: center
}
.list-sponsor li.logo-empty{width: 1px}
#hm h2,
#ha h2{
    width: 400px;
    margin: auto auto 30px
}
.list-sponsor.list-g li{
	font-size: 60px;
	width: 45%;
}
.list-sponsor.list-h li{
	font-size: 45px;
	width: 28%;
}
@media screen and (max-width: 768px){
#sponsor h2{font-size: 24px;}	
#sponsor-list h3.title-sub{font-size: 22px;}	
#hm{
	padding-top: 0px;
	padding-bottom: 0px
}	
.list-sponsor.list-a1 li{
    width: 75%;
    margin: 0 0 20px;
	font-size: 40px;
}
.list-sponsor.list-a1 li.logo-wide{width: 100%;}
.list-sponsor.list-a1 li.logo-m{
	width: 55%;
	margin-left: 20px;
    margin-right: 20px;
}	
.list-sponsor.list-a1 li.logo-s{
    width: 50%;
    margin-left: 20px;
    margin-right: 20px;
}
.list-sponsor.list-a1 li.logo-l{width: 85%}	
.list-sponsor.list-a1 li.logo-wide{width: 100%;}	
.list-sponsor.list-a1 li.docomo{width: 75%;}	
.list-sponsor.list-a2 li{
	width: 45%;
	margin-left: 20%;
	margin-right: 20%;
}
.list-sponsor.list-a2 li.logo-wide{
	width: 80%;
	margin-left: 5%;
	margin-right: 5%;
}
.list-sponsor.list-a2 li.logo-wide-2{
	width: 85%;
	margin-left: 5%;
	margin-right: 5%;
}
.list-sponsor.list-a2 li.logo-medium{width: 50%;}
.list-sponsor.list-a2 li.logo-medium-s{width: 45%;}	
.list-sponsor.list-a2 li.logo-small{width: 40%;}	
.list-sponsor.list-a2 li.logo-small-s{width: 37%;}	
#hm h2,
#ha h2{width: 320px;}	
.list-sponsor.list-g li{width: 80%;}
.list-sponsor.list-h li{width: 60%;}	
.list-sponsor li{font-size: 20px;}	
.list-sponsor li#goujin{width: 60%;}	
}



#container-artist .block-half{margin-top: 30px}
#container-artist h2{
    color: #00509e;
    font-size: 19px;
    font-weight: bold;
    line-height: 1.4;
	margin-top: 5px;
    margin-bottom: 10px;
}
#container-artist h2 span{
    font-size: 15px;
    display: block;
}


/* -----------------------------------
    画像ギャラリー
   ----------------------------------- */
#gallery{
	margin-top: 30px;
	margin-bottom: 50px;
}
#gallery a{
	display: block;
	width: 100%;
	height: 100%
}


/* -----------------------------------
    タブ切り替え
   ----------------------------------- */
#event{overflow: hidden}
.tabs{
	display: flex;
	flex-wrap: wrap;
	margin-top: 50px;
	margin-bottom: 50px;
}
.tabs::after {	
	content: '';
	width: 100%;
	order: -1;
	margin-top: 30px;
}
.tabs .tab-label {
    margin-right: 5px;
    line-height: 1.05;
    padding: 0 20px;
    order: -1;
    border-radius: 24px;
    background-color: #ffffff;
    color: #00509e;
    transition: .5s;
    cursor: pointer;
    font-size: 15px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 48px;
    font-weight: bold;
    margin-bottom: 10px;
	border: 1px solid #00509e
}
.tabs .tab-label:nth-last-of-type(1) {margin-right: 0;}
.tabs .tab-label a{color: #00509e}
.tabs .tab-label:hover a{color: #ffffff}
.tabs .tab-label span{display: block}
.tabs input {display: none;}
.tabs .content {
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}
.tabs input:checked + .tab-label,
.tabs .tab-label:hover {
	color: #fff;
	background-color: #00509e;
}
.tabs input:checked + .tab-label + .content {
	height: auto;
	transition: .5s opacity;
	opacity: 1;
}
.tabs article + article{
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px dotted #BCC0D7;
}
.tabs article .block-photo{width: 25%}
.tabs article .block-text{width: calc(100% - 28%)}
.tabs article .block-photo-wide{width: 35%}
.tabs article .block-text-wide{width: 62%;}
.tabs article .block-text h2{
	font-size: 20px;
    margin-bottom: 10px;
    color: #00509e;
	font-weight: bold;
	line-height: 1.4
}
.tabs article .block-text h2 small{
	font-size: 70%;
	margin-left: 5px;
    margin-right: 5px;
}
.tabs article .block-text h2 a{color: #00509e;}
.tabs article a .block-text h2:after,
.tabs article .block-text a h2:after,
.tabs article .block-text h2 a:after{
	font-family: 'FontAwesome';
    content: "\f101";
    position: absolute;
    padding-left: 0.5em;
}
.tabs article .block-text h3{
    font-weight: bold;
    font-size: 18px;
    margin-top: 15px;
	margin-bottom: 5px;
	border-bottom: 1px solid #00509e;
	color: #00509e;
}
.tabs article .block-text p{font-size: 18px;}
.tabs article .block-text p.txt-caption{
    font-size: 16px;
    line-height: 1.3;
}
.tabs article .block-text .price-free,
.tabs article .block-text .price{
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    display: inline-block;
    color: #ffffff;
    padding: 1px 5px;
    background-color: #d7000f;
    margin-top: 3px;
    margin-right: 5px;
	min-width: 100px
}
.tabs article .block-text .price-free{background-color: #384249}
.tabs article .block-text dl{}
.tabs article .block-text dt{
	font-size: 16px;
	font-weight: bold;
	margin-top: 5px;	
}
.tabs article .block-text dd{
	font-size: 15px;
}
.tabs article a{display: block}
.tabs article a img{line-height: 0}
.tabs article a:hover h2,
.tabs article a:hover p{color: #000000}
.tabs article a:hover img{
	transform: translateY(-3px);
	box-shadow: 0 6px 5px -3px rgba(0,0,0,.3);
	transition: transform .3s;
}
.tabs article a:hover img.no-hover{
	transform: translateY(0px);
	box-shadow: 0 0 0 0 rgba(0,0,0,0);
	transition: transform .3s;
}
span.stop{
    background-color: #FF0000;
    color: #ffffff;
    display: inline-block;
    font-size: 85%;
    padding: 1px 6px;
    margin-right: 5px;
}
/*入れ子タブ*/
#content_inner{
    border-top: 1px dotted #00509e;
    padding-top: 30px;
}
#content_inner .tabs{margin-top: 0}
#content_inner .tabs .tab-label,
.tabs .tab-label-02{
    padding: 5px 20px 1px;
    border-radius: 6px 6px 0 0;
    background-color: #99A8B7;
    color: #ffffff;
    min-height: 32px;
    margin-bottom: 0px;
    border: none
}
#content_inner .content .tabs::after,
#content_inner2 .tabs::after{
    content: '';
    width: 100%;
    height: 1px;
    order: -1;
    display: block;
    background-color: #00509e;
	margin-top: 0;
	margin-bottom: 20px;
}
#content_inner .tabs input:checked + .tab-label,
#content_inner .tabs .tab-label:hover {
	color: #fff;
	background-color: #00509e;
}

#content_inner .tabs .tab-label.tab-label-2 {
    padding: 0px 20px;
    min-height: 40px;
    border-radius: 22px;
    background-color: #99A8B7;
    color: #ffffff;
    margin-bottom: 0px;
}
#content_inner .tabs .tab-label-2::after {
    display: none
}
#content_inner .tabs input:checked + .tab-label,
#content_inner .tabs .tab-label:hover {
	color: #fff;
	background-color: #00509e;
}

/*長方形タブ*/
.tabs-02{
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
	margin-bottom: 50px;
}
.tabs-02::after {	
	content: '';
	width: 100%;
	order: -1;
	margin-top: 30px;
}
.tabs-02 .tab-label {
    margin-right: 5px;
    line-height: 1.05;
    order: -1;
    transition: .5s;
    cursor: pointer;
    font-size: 15px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
	padding: 5px 20px 1px;
    border-radius: 6px 6px 0 0;
    background-color: #99A8B7;
    color: #ffffff;
    min-height: 32px;
}
.tabs-02::after {
    content: '';
    width: 100%;
    height: 1px;
    order: -1;
    display: block;
    background-color: #00509e;
    margin-top: 0;
    margin-bottom: 20px;
}
.tabs-02 .tab-label a{color: #00509e}
.tabs-02 .tab-label:hover a{color: #ffffff}
.tabs-02 .tab-label span{display: block}
.tabs-02 input {display: none;}
.tabs-02 .content {
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
}
.tabs-02 input:checked + .tab-label,
.tabs-02 .tab-label:hover {
	color: #fff;
	background-color: #00509e;
}
.tabs-02 input:checked + .tab-label + .content {
	height: auto;
	transition: .5s opacity;
	opacity: 1;
}
/*@media screen and (min-width: 769px) {
.tabs .tab-label a{
	height: 48px;
	line-height: 48px;}	
}*/
@media screen and (max-width: 768px) {	
.tabs{justify-content: center}	
.tabs .tab-label {
	width: 150px;
	border-radius: 6px;
	margin-bottom: 20px;
}	
#content_inner .tabs .tab-label{
    width: 48%;
    border-radius: 6px;
    margin-bottom: 10px;
    padding: 8px;
}	
.tabs-02 .tab-label {
	border-radius: 6px;
	margin-bottom: 10px;
    padding: 8px;
	min-width: 48%;
	margin-left: auto;
	margin-right: auto
}	
}
@media screen and (max-width:680px) {
.tabs{margin-top: 0px;}	
.tabs .tab-label {
	font-size: 15px;
	width: 31.5%;
	padding: 10px 5px;
	margin-bottom: 10px;
}		
.tabs article .block-photo{
    width: 100%;
    margin-bottom: 10px;
}	
.tabs article .block-text{width: 100%}	
.tabs article .block-photo-wide,
.tabs article .block-text-wide{width: 100%;}	
.tabs article .block-text p{font-size: 16px;}	
.sp-container-reverse,
.container-reverse{flex-direction: column-reverse}	
#tab-10 ~ .content article > .container-flex .block-photo-wide,
.container-reverse .block-photo-wide{margin-top: 20px}
}

/* -----------------------------------
    メッセージ
   ----------------------------------- */
#text-name{
	text-align: right;
	font-weight: bold;
	margin-top: 10px;
	font-size: 18px;
}

/* -----------------------------------
    アンバサダー
   ----------------------------------- */
#block-stu{
    background-image: url(../images/support/logo-stu48.svg);
    background-repeat: no-repeat;
    background-size: 80px auto;
    background-position: left top;
    margin: 30px auto 0;
    width: 600px;
	height: 150px
}
#block-stu p{padding-left: 120px}
@media screen and (max-width: 680px) {
#block-stu{width: 100%;}
#block-stu p{padding-left: 95px}	
}



@media screen and (max-width: 768px){
#name .block-half,
.name .block-half	{width: 50% !important}
}

/* -----------------------------------
    動画
   ----------------------------------- */
.container-youtubeBox h2.ttl-yt{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	margin-top: 40px;
	margin-bottom: 15px
}
.container-youtubeBox h2{
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	margin-top: 40px;
	margin-bottom: 15px;
	color: #00509e;
}
.container-youtube {
	background-color: #000000;
	position: relative;
	width: 100%;
	padding-top: 55%;
}
.container-youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
@media screen and (max-width: 768px){
.container-youtubeBox h2.ttl-yt{font-size: 18px;}	
.container-youtubeBox h2{font-size: 17px}	
}

/* -----------------------------------
    ひろフェス フェア
   ----------------------------------- */
#header-campaign{
    position: relative;
    max-height: 280px;
    overflow: hidden;
    margin-bottom: 30px;
}
#header-campaign #inner{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 90%;
	height: 80%;
	max-width: 1100px;
}
@media screen and (max-width: 768px){
#header-campaign{max-height: 100%;}	
#header-campaign #inner{width: 85%;}	
}


/* -----------------------------------
    グッズ
   ----------------------------------- */
#goods .container-main{
    min-height: auto;
    margin-bottom: 80px;
    margin-top: 15px;
}
.list-3 li{width: 33.3333%}
.block-h{
    width: 480px;
    margin-bottom: 15px;
    padding-top: 50px;
    padding-bottom: 50px;
}
.block-h-l{
    margin-left: auto;
    margin-right: 0px;
}
.block-h-r{
    margin-left: 0px;
    margin-right: auto;
}
.list-price {
	width: 80%;
	margin: auto;
}
.list-price dt{
    background-color: #00509e;
    color: #ffffff;
    font-size: 14px;
    width: 65px;
    text-align: center;
    float: left;
    margin-right: 10px;
	margin-bottom: 5px
}
.list-price dd{margin-bottom: 5px}
.list-price dd storng{font-size: 18px;}
.list-price dd.dd-wide{line-height: 1.4}
@media screen and (max-width: 768px){
.list-3 li{
	width: 90%;
	margin-top: 30px
}
#goods .width50per{width: 100% !important;}
.block-h{
    width: 90%;
    margin-left: auto;
	margin-right: auto;
}	
.list-price {width: 100%;}	
}



/*---------------------------------------------
	リスト　8/12追加
  ---------------------------------------------*/
.dl-list-backstage{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-left: 18px;
}
.dl-list-backstage dt{
    font-weight: bold;
    width: 100px;
}
.dl-list-backstage dd{width: calc(100% - 110px);}

@media screen and (max-width: 768px) {
.dl-list-backstage dt,
.dl-list-backstage dd{width: 100%;}
}


#anchor{
    margin-top: -90px;
    padding-top: 90px
}
@media screen and (max-width: 768px){
#anchor{
    margin-top: -50px;
    padding-top: 50px
}    
}




