@charset "UTF-8";

/*
  ページ別CSS
*/

/***********************************************************
#1 オーバーライド: c-main
***********************************************************/
#c-main {
}

#c-main a.a-linkbtn {
  padding: 0.5em 1.5em;
  font-size: 0.9em;
	margin:  2.0em 0 1.0em ;
	border: solid 1px #333;
	width: inherit;
	color: #333;
	text-decoration: none;
}


#c-main p.p-btn {
  letter-spacing: 0.02em;
  font-weight: 300;
  margin: 1.5em 0 0.5em ;
  padding: 0 ;
}
#c-main p.p-btn a:link,
#c-main p.p-btn a:visited {
  font-size:0.9em;
  letter-spacing: 0.05em;
  color: #003266;
  border: solid 1px #003266;
  padding: 0.4em 2.0em 0.6em;
  text-decoration: none;
  display: inline-block;
  font-weight: 600;
  background: #fff;
  border-radius: 100vw;
}
#c-main p.p-btn a:hover {
  text-decoration: underline;
  background: #036eb8;
}

#c-main p.p-btn02 {
  letter-spacing: 0.02em;
  font-weight: 300;
  margin: 1.5em 0 0.5em ;
  padding: 0 ;
}
#c-main p.p-btn02 a:link,
#c-main p.p-btn02 a:visited {
  font-size:0.9em;
  letter-spacing: 0.05em;
  color: #003266;
  border: solid 2px #003266;
  padding: 0.4em 2.0em 0.6em;
  text-decoration: none;
  display: inline-block;
  font-weight: 600;
  background: #fff;
  border-radius: 100vw;
}
#c-main p.p-btn02 a:hover {
  text-decoration: underline;
  background: #036eb8;
}


#c-main p.p-sub {
  font-size: 1.2em;
  font-weight: 600;
}

/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {
}


/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
#c-main p.p-sub {
  font-size: 0.9em;
  font-weight: 600;
}

}


/***********************************************************
#1 背景カラー　エリア区分
***********************************************************/

#c-main #area-blue {
  padding: 0 0 3.0em ;
  margin: 0 ;
  width: 100%;
  max-width: 100%;
  background: rgba(3,110,184,0.85);
}

#c-main #area-blue h2 {
  color: #fff;
}
#c-main #area-blue h3 {
  color: #fff;
}
#c-main #area-blue p {
  color: #fff;
}


/***********************************************************
#1 メニューエリア
***********************************************************/


#c-main .box-about00 {
  padding: 1.0em 0 1.0em ;
  margin:0 auto;
  width: 65vw;
  max-width: 100%;
}


#c-main .box-menu {
  padding: 1.0em 0;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .box-menu h2 {
  padding: 1.0em 0 0.5em;
  margin: 0 ;
  text-align: center;
  color: #fff;
  font-size: 1.6em;
}

#c-main .col-menu{
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 3.0em 0 1.0em ;
  display: flex;
  flex-direction: row;
  justify-content: center ;
}

#c-main .col-menu-co{
  flex-basis: 35%;
  max-width: 100%;
  margin: 0 0 1.0em;
  padding: 0 2% ;
  color: #fff;
  border-right: solid 1px #fff;
  display: flex;
  flex-direction: column;
}
#c-main .col-menu-co-unit{
  margin: 0 0 1.0em;
  display: flex;
  flex-direction: row;
  padding: 0 ;
  align-items: center;
}
#c-main .col-menu-co-unit-r{
  margin: 0 0 0 0.8em;
  padding: 0.8em 0.5em;
  border: solid 1px #fff;
}
#c-main .col-menu-co-unit:last-child{
  margin: 0;
}
#c-main .col-menu-co p.day{
  font-family: "susanoo", sans-serif;
  font-size: 3.3em;
  margin: 0.2em 0;
  text-align: left;
  letter-spacing: 0.05em;
}
#c-main .col-menu-co p.day .small{
  font-size: 70%;
  padding-left: 0.1em;
  vertical-align: middle;
  letter-spacing: 0;
}

#c-main .cell-tipoff{
  width: 100%;
  max-width: 100%;
  margin: 1.3em auto 0.5em ;
  padding: 0 ;
  display: flex;
  flex-direction: row;
  align-items: center;
}
#c-main .cell-tipoff p{
  flex-basis: 50%;
  max-width: 100%;
  margin: 0 ;
  font-family: "Bebas Neue", sans-serif;
}
#c-main .cell-tipoff p.title {
  background: #fff;
  color: #333 !important;
  padding: 0.2em 0;
  font-weight: 500;
  font-size: 1.3em;
  text-align: center;
}

#c-main .cell-tipoff p.time {
  color: #fff;
  padding: 0;
  font-weight: 500;
  font-size: 2.2em;
  text-align: center;
}

#c-main .col-menu-co02{
  flex-basis: 65%;
  max-width: 100%;
  margin: 0 0 1.0em;
  padding: 0.7em 2% 0 ;
  color: #fff;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

#c-main .col-menu-co02 p{
  flex-basis: calc( 100% / 3 - 2%);
  max-width: 100%;
  margin: 0 1% 1em;
  padding: 0.5em auto !important;
  text-align: center;
  border: solid 2px #fff;
  height: 95px;
  line-height: 1.0em;
  position: relative;
}

#c-main .col-menu-co02 p a:link,
#c-main .col-menu-co02 p a:visited{
  position: absolute;
  top: 0 ;
  left: 0 ;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #fff;
  font-size: clamp(0.8em,0.9vw,1.1em);
  font-weight: 600;
  padding-top: 5px;
}
#c-main .col-menu-co02 p a:hover,
#c-main .col-menu-co02 p a:hover{
  text-decoration: underline;
  background: #999;
}

#c-main .col-menu-co02 p img{
  height: 50px;
  padding-bottom: 	2px;
  margin-top: 10px;
}


/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {

#c-main .box-about00 {
  width: 100vw;
  max-width: 100%;
}

#c-main .box-menu {
  padding: 0;
  margin: 0 auto;
  width: 85vw;
  max-width: 100%;
}

#c-main .col-menu{
  padding: 1.0em 0 0 ;
  flex-direction: column;
}
#c-main .col-menu-co{
  color: #fff;
  border-right: none;
  flex-direction: row;
  justify-content: space-between;
}
#c-main .col-menu-co-unit{
  flex-basis: 48%;
  margin: 0 ;
  flex-direction: column;
}
	
#c-main .col-menu-co-unit-r{
  margin: 0 auto;
  padding: 0.4em 0.8em ;
  border: solid 1px #fff;
  max-width: 90%;
}	
#c-main .col-menu-co p.day{
  padding: 0 ;
  margin: 0 ;
  font-size: 2.3em;
}
#c-main .cell-tipoff{
  margin: 0 auto 0.5em ;
  padding: 0 ;
}
#c-main .cell-tipoff p.title {
  background: #fff;
  color: #000;
  padding: 0.1em 0;
  font-weight: 500;
  font-size: 1.3em;
  text-align: center;
}

#c-main .cell-tipoff p.time {
  color: #fff;
  padding: 0;
  font-weight: 500;
  font-size: 1.6em;
  text-align: center;
}
#c-main .col-menu-co02 p img{
  margin-top: 5px;
}
	
	
}

/***********************************************************
#1 みどころエリア
***********************************************************/
#c-main .box-watch {
  padding: 1.0em 0;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .box-watch h3 {
  font-size: 1.2em;
  line-height: 1.4em;
  font-weight: 600;
  color: #fff;
  margin: 0.5em 0 0.3em;
  padding: 0 ;
}

#c-main .box-watch p {
  font-size: 0.9em;
  line-height: 1.4em;
}

#c-main .box-watch details {
  margin-bottom: 30px;
}

#c-main .box-watch summary {
  padding: 0.5em;
  cursor: pointer;
  outline: none; /* クリック時の枠線を消す */
  color: #fff;
  font-size: 0.9em;
}

/* --- ここからがマーカーを変更するコードです --- */

/* 1. デフォルトのマーカー（▲）を非表示にする */
#c-main .box-watch summary {
  list-style: none; /* Firefox, Safari */
}
#c-main .box-watch summary::-webkit-details-marker {
  display: none; /* Chrome */
}

/* 2. 疑似要素で新しいマーカーを追加（閉じている時） */
#c-main .box-watch summary::before {
  content: "+";
  margin-right: 8px; /* アイコンとテキストの間隔 */
  font-weight: bold;
  font-size: 1.2em;
}

/* 3. detailsが開いている時のマーカーを指定 */
#c-main .box-watch details[open] > summary::before {
  content: "-";
}

/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {
}


/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
#c-main .box-watch {
  width: 80%;
  max-width: 90%;
}
	
#c-main .box-watch p {
  font-size: 0.8em;
}


}


/***********************************************************
#1 対戦相手
***********************************************************/

#c-main .box-away {
  padding: 1.0em 0 ;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .box-away h3 {
  font-size: 1.2em;
  line-height: 1.4em;
  font-weight: 600;
  color: #fff;
  margin: 0.5em 0 0.3em;
  padding: 0 ;
}
#c-main .box-away p {
  text-align: center;
  line-height: 1.2em;
  font-size: 0.8em;
  padding-bottom: 1.0em;
}
#c-main .box-away ul {
  margin-left: 0 ;
}

/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {

	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
#c-main .box-away {
  width: 80%;
  max-width: 90%;
}	

}


/***********************************************************
#1 ゲームスケジュール
***********************************************************/

#c-main .box-schedule {
  padding: 1.0em 0  ;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .box-schedule-in h2 {
  color: #fff;
  text-align: center;
}
#c-main .box-schedule-in p {
  color: #fff;
  text-align: center;
}

/*タブ切り替え全体のスタイル*/
.tabs {
  background:none;
  width: 85vw;
  max-width: 96%;
  margin: 2.5em auto 0.5em;
}

/*タブのスタイル*/
.tab_item {
  width: calc(100% / 3 - 6px);
  height: 40px;
  background-color: #05517d;
  line-height: 40px;
  font-size: 1.1em;
  text-align: center;
  color: #fff;
  display: block;
  float: left;
  font-weight: 400;
  transition: all 0.2s ease;
  margin: 0 3px; 
  border-radius: 100vh;
  font-family: 'susanoo';/* フォント名 */
}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
#c-main .tab_content {
  display: none;
  padding: 1.0em 0 0 ;
  clear: both;
  overflow: hidden;
  color: #fff;
}

#c-main .tab_content dl.dl-sch  {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 1.0em	0 0.3em; 
  justify-content: center;
}
#c-main .tab_content dl.dl-sch dt  {
  flex-basis: 12%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 0 ;
  text-align: center;
  font-size: 1.0em;
  background: #fff;
  color: #004e92;
  font-weight: 600;
  border: solid 1px #fff;
}

#c-main .tab_content dl.dl-sch dd  {
  flex-basis: 88%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 0.8em ;
  font-size: 1.0em;
  border: solid 1px #fff;
}
#c-main .tab_content dl.dl-sch dd.popup  {
  flex-basis: 88%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 90px 0.6em 0.8em ;
  font-size: 1.0em;
  border: solid 1px #fff;
  position: relative;
}

#c-main .tab_content dl.dl-sch dd .pop {
  margin: 0 ;
  padding: 0.5em 1.0em 0.5em 40px; 
  font-size: 0.9em;
  font-weight: 600;
  position: absolute;
  right: 2%;
  top: 50%;
  transform: translateY(-50%);
  background: url("../common/images/pop.png") 7px center #fff no-repeat;
  line-height: 1.0em;
  border-radius: 0.2em;
}

#c-main .tab_content h3  {
  color: #fff;
}

/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #fff;
  color: #004e92;
}

#c-main h3.h3-timeline {
  margin: 0.5em 0 0.1em;
  font-size: 1.8em !important;
  line-height: 120%;
  color: #fff;
  letter-spacing: 0.01em;
  font-family: 'susanoo';/* フォント名 */
  font-weight: 400 !important;
  vertical-align: middle;
  padding: 0 ;
}
#c-main h3.h3-timeline:before {
  content: "-";
  margin-right: 10px;
}



/*//////////////////
#4 平日開催（単日用）
//////////////////*/

#c-main .col-single {
  padding: 1.0em 0 0 ;
  clear: both;
  overflow: hidden;
  color: #fff;
}

#c-main .col-single dl.dl-sch  {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 1.0em	0 0.3em; 
  justify-content: center;
}
#c-main .col-single dl.dl-sch dt  {
  flex-basis: 12%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 0 ;
  text-align: center;
  font-size: 1.0em;
  background: #fff;
  color: #004e92;
  font-weight: 600;
  border: solid 1px #fff;
}

#c-main .col-single dl.dl-sch dd  {
  flex-basis: 88%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 0.8em ;
  font-size: 1.0em;
  border: solid 1px #fff;
}
#c-main .col-single dl.dl-sch dd.popup  {
  flex-basis: 88%;
  max-width: 100%;
  margin: 0 0 10px ;
  padding: 0.6em 90px 0.6em 0.8em ;
  font-size: 1.0em;
  border: solid 1px #fff;
  position: relative;
}

#c-main .col-single dl.dl-sch dd .pop {
  margin: 0 ;
  padding: 0.5em 1.0em 0.5em 40px; 
  font-size: 0.9em;
  font-weight: 600;
  position: absolute;
  right: 2%;
  top: 50%;
  transform: translateY(-50%);
  background: url("../common/images/pop.png") 7px center #fff no-repeat;
  line-height: 1.0em;
  border-radius: 0.2em;
}

#c-main .col-single h3  {
  color: #fff;
}






/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {
	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {

#c-main .box-schedule {
  width: 80%;
}
	
	
#c-main .tab_content dl.dl-sch dt {
  flex-basis: 15%;
  font-size: 0.8em;
}

#c-main .tab_content dl.dl-sch dd {
  flex-basis: 85%;
  padding: 0.6em 0.8em ;
  font-size: 0.8em;
  line-height: 1.1em;
}

#c-main .tab_content dl.dl-sch dd.popup {
  flex-basis: 85%;
  padding: 0.6em 65px 0.6em 0.8em ;
  font-size: 0.8em;
  line-height: 1.1em;
}

#c-main .tab_content dl.dl-sch dd .pop {
  margin: 0 ;
  padding: 0.8em 1.0em 0.8em 30px; 
  font-size: 0.8em;
  background: url("../common/images/pop.png") 3px center #fff no-repeat;
}
	
#c-main .col-single dl.dl-sch dt {
  flex-basis: 15%;
  font-size: 0.8em;
}

#c-main .col-single dl.dl-sch dd {
  flex-basis: 85%;
  padding: 0.6em 0.8em ;
  font-size: 0.8em;
  line-height: 1.1em;
}

#c-main .col-single dl.dl-sch dd.popup {
  flex-basis: 85%;
  padding: 0.6em 65px 0.6em 0.8em ;
  font-size: 0.8em;
  line-height: 1.1em;
}

#c-main .col-single dl.dl-sch dd .pop {
  margin: 0 ;
  padding: 0.8em 1.0em 0.8em 30px; 
  font-size: 0.8em;
  background: url("../common/images/pop.png") 3px center #fff no-repeat;
}
		
	
	
}

/***********************************************************
#1 イベント
***********************************************************/

#c-main .col-event{
  width: 100%;
  max-width: 100%;
  margin: 1.0em 0 ;
  padding: 0 ;
  color: #fff;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
#c-main .col-event p{
  flex-basis: calc(100% / 3 - 2%) ;
  max-width: 100%;
  margin: 0 1% 1.0em ;
  padding: 0 ;
  color: #fff;
  text-align: center;
  position: relative;
}

#c-main .col-event p .p-pop{
  position: absolute;
  top: 3%;
  right: 3%;
}


#c-main .col-event p a:link{
  color: #fff;
  text-decoration: underline;
}

#c-main .col-event02{
  width: 100%;
  max-width: 100%;
  margin: 1.0em 0 ;
  padding: 0 ;
  color: #fff;
}
#c-main .col-event02 p{
  width: 100% ;
  max-width: 100%;
  margin: 0 1% 1.0em ;
  padding: 0 ;
  color: #fff;
  text-align: center;
  position: relative;
}

#c-main .col-event02 p .p-pop{
  position: absolute;
  top: 3%;
  right: 3%;
}


#c-main .col-event02 p a:link{
  color: #fff;
  text-decoration: underline;
}


/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {
	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {

#c-main .col-event p{
  flex-basis: calc(100% / 2 - 2%) ;
}	
	
}

/***********************************************************
#1 グッズ、会場マップ
***********************************************************/

#c-main .box-goods {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .col-goods {
  padding: 0 ;
  margin: 0 ;
  width: 100%;
  max-width: 100%;
}
#c-main .col-goods ul {
  margin-left: 0 ;
}

#c-main .box-map {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .col-map {
  padding: 0 ;
  margin: 0 ;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
#c-main .col-map p {
  flex-basis: 48%;
  margin: 0 ;
  text-align: center;
  position: relative;
  height: 50px;
  vertical-align: middle;
}
#c-main .col-map p a:link,
#c-main .col-map p a:visited {
  background: #fff;
  text-decoration: none ;
  position: absolute;
  top: 0 ;
  left: 0 ;
  width: 100%;
  height: 100%;
  padding: 12px 0.3em 10px ;
  color: #003266;
  border: solid 2px #003266;
  border-radius: 100vw;
  font-weight: 400;
  line-height: 1.1em;
  font-family: 'susanoo';/* フォント名 */
  font-size: 1.3em;
}
#c-main .col-map p a:hover {
  text-decoration: underline;
  background: #036eb8;
  color: #fff;
}



/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {

	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
#c-main .box-goods {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 80%;
}
	
#c-main .box-map {
  width: 80%;
  max-width: 90%;
}	
	
#c-main .col-map p a:link,
#c-main .col-map p a:visited {
  padding-top: 7px;
}

#c-main .col-map p {
  height: 38px;
}

}

/***********************************************************
#1 アクセス
***********************************************************/

#c-main .box-access {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}

#c-main .col-access {
  padding: 0 ;
  margin: 0 ;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

#c-main .col-access-l {
  flex-basis: 50%;
  max-width: 96%;
  padding: 0 ;
  margin: 0 0 1.0em  ;
}

#c-main .col-access-r {
  flex-basis: 50%;
  max-width: 96%;
  padding: 0.5em 1.5em;
  margin: 0 ;
}
#c-main .col-access-r h2 {
  flex-basis: 50%;
  max-width: 96%;
  padding: 0;
  margin: 0.3em 0 0.3em  ;
}

/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {

	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
#c-main .box-access {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 80%;
}

#c-main .col-access {
  flex-direction:column;
}
#c-main .col-access-r {
  padding: 0.5em 0;
}

}

/***********************************************************
#1 観戦ルール
***********************************************************/

#c-main .box-rule {
  padding: 1.0em 0 1.5em;
  margin: 0 auto;
  width: 1080px;
  max-width: 90%;
}


/*//////////////////
#4 レスポンシブ（タブレット用）
//////////////////*/
@media screen and (max-width: 768px) {

	
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {

}


/***********************************************************
#1 TOPページ モーダルエリア
***********************************************************/

/*全て共通：hideエリアをはじめは非表示*/
.hide-area{
  display: none;
}

/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
  background:#ccc;  
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
  background:#666;
}

/*動画表示のモーダル：余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper{
  padding:0;
  background: #000;
}

/*以下はコンテンツ内のレイアウト*/
.modaal-container {
    color: #666;
    max-width: 60vw;
    background: #fff;
	padding: 0;
}

.modaal-content-container {
	padding: 0;
}

.modaal-container .col-modaal {
  width: 100%;
  max-width: 100%;
  margin: 0 ;
  padding: 1.5em 1.0em ;
  display: flex;
  flex-direction: row;
}

.modaal-container .col-modaal-l {
  flex-basis: 50%;
  max-width: 100%;
  margin: 0 0 1.0em;
  padding: 0 ;
}
.modaal-container .col-modaal-r {
  flex-basis: 50%;
  max-width: 100%;
  margin: 0 0 1.0em;
  padding: 0.8em 1.0em ;
}


.modaal-container .col-modaal-r h2 {
  font-size: 1.2em;
  margin-bottom: 0.5em;
  border-bottom: 2.0px solid #ccc;
  padding-bottom: 0.3em;
}

.modaal-container .col-modaal p {
  font-size: 0.9em;
  line-height: 1.1em;
  margin-bottom: 1.0em;
}


.modaal-close {
  top:90%;
}

.modaal-container .col-modaal ul {
  font-size: 0.9em;
  margin: 1.0em 0 ;
  padding: 0 ;
}
.modaal-container .col-modaal ul li {
  font-size: 0.8em;
  margin: 0 0.3em 0.3em ;
  padding: 0.1em 1.0em ;
  list-style: none;
  display: inline-block;
  background: #007AB7;
  color: #fff;
  border-radius: 0.8em;
}
.modaal-container .col-modaal ul li.red {
  background: #ff0000;
}
.modaal-container .col-modaal ul li.green {
  background: green;
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {
	
.modaal-container {
    max-width: 80vw;
}

.modaal-container .col-modaal {
  flex-direction: column;
}
	
}


/***********************************************************
#1 駐車場
***********************************************************/


#c-main .qa {
    max-width: 96%;
	margin: 0 auto 15px auto;
    border: 2px solid #fff;
	padding: 0 2.0em 0.5em ;
}

#c-main .qa summary {
    align-items: flex-start;
    position: relative;
    padding: 1em 0 1em ;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
	font-size: 1.1em;
}

#c-main .qa summary::after {
    position: absolute;
    right: 20px;
    transform: translateY(-25%) rotate(45deg);
    width: 10px;
    height: 10px;
    margin: 10px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    content: '';
    transition: transform .5s;
}

/*//////////////////
#4 レスポンシブ（スマートフォン用）
//////////////////*/
@media screen and (max-width: 640px) {

#c-main .qa {
	padding: 0 0.5em 0.5em ;
}
	
	
#c-main .qa summary {
 	font-size: 0.9em;
    padding: 1em ;
}
	
#c-main .qa summary::after {
    display: none;
}
}


.slick-prev:before, .slick-next:before {
    color: #000;/*黒にする*/
    opacity: 1;/*デフォルトは.75が指定されている*/
}




