@charset "utf-8";
/* event css */

.bg_imgbox {
background-image: url("../img/event/title_bg.jpg");
background-size: cover;
}
.page_title {
white-space: nowrap;
}

@media all and (max-width : 767px ){
.bg_imgbox {
background-image: url("../img/event/title_bg_sp.png");
background-size: cover;
}
}

/* イベント一覧
-------------------------------------------------- */

.intro_txt {
line-height: 200%;
margin-bottom: 50px;
}

.event_box_wrap {
display: flex;
flex-wrap: wrap;
}

.event_box {
width: calc(33.333333% - 80px / 3);
margin-right: 40px;
margin-bottom: 40px;
background: #fff;
position: relative;
border-radius: 10px;
padding-bottom: 40px;
}

@media all and (max-width : 1024px ){
.event_box {
width: calc(33.333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 20px;
}
}

.event_box:nth-child(3n) {
margin-right: 0px;
}

@media all and (max-width : 820px ){
.event_box {
width: calc(50% - 20px / 2);
}
.event_box:nth-child(3n) {
margin-right: 20px;
}
.event_box:nth-child(2n) {
margin-right: 0px;
}
}

@media all and (max-width : 767px ){
.event_box {
width: calc(50% - 10px / 2);
margin-right: 10px;
margin-bottom: 10px;
padding-bottom: 20px;
}
.event_box:nth-child(3n) {
margin-right: 10px;
}
.event_box:nth-child(6n) {
margin-right: 0px;
}
}


.event_imgbox {
width: 100%;
height: auto;
position: relative;
background: #000;
overflow: hidden;
border-radius: 10px 10px 0 0;
z-index: 1;
}
.event_imgbox img {
width: 100%;
transition-duration: 0.7s;	
aspect-ratio: 3 / 2;
object-fit: cover;
border-radius: 10px 10px 0 0;
}
.event_imgbox img:hover {
transform: scale(1.05);	
transition-duration: 0.7s;	
opacity: 0.8;
}
.area_cat {
display: flex;
flex-direction: column;
align-items: center;
color: #fff;
text-align: center;
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-size: 1.3rem;
margin-top: -21px;
position: relative;
z-index: 5;
margin-bottom: 20px;
}
.area_cat span {
background: #4496B3;
padding: 12px 35px;
line-height: 100%;
border-radius: 30px;
}
.inner_box {
padding: 0 20px;
}
.page_event .event_titlebox {
line-height: 120%;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 20px;
}
.page_event .event_title {
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-size: 1.6rem;
}
.listbox {
display: flex;
align-items: flex-start;
margin-bottom: 5px;
}
.listbox dt {
height: 16px;
width: auto;
margin-right: 12px;
}
.listbox dd {
font-size: 1.3rem;
line-height: 100%;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 10px;
}
.event_cap {
margin-top: 10px;
font-size: 1.3rem;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
}
.icon_held {
position: absolute;
top: -30px;
left: 15px;
z-index: 10;
}
.icon_held img {
width: 100%;
}


/* イベント一覧　スマートフォン
-------------------------------------------------- */

@media all and (max-width : 767px ){
.intro_txt {
font-size: 1.2rem;
line-height: 180%;
margin-bottom: 30px;
}

.area_cat {
font-size: 1.0rem;
margin-top: -15px;
margin-bottom: 10px;
}
.area_cat span {
padding: 8px 15px;
border-radius: 20px;
letter-spacing: 0.05em;
}
.inner_box {
padding: 0 10px;
}
.page_event .event_titlebox {
margin-bottom: 15px;
}
.page_event .event_title {
font-size: 1.2rem;
}
.listbox {
display: flex;
align-items: flex-start;
margin-bottom: 3px;
}
.listbox dt {
height: 12px;
margin-right: 7px;
}
.listbox dd {
font-size: 1.0rem;
margin-bottom: 10px;
letter-spacing: 0.05em;
}
.event_cap {
margin-top: 10px;
font-size: 1.0rem;
}
.icon_held {
position: absolute;
top: -20px;
left: 10px;
}
.icon_held img {
width: 70%;
}
}





/* イベント詳細ページ
-------------------------------------------------- */

.eventbox_inner {
background: #fff;
padding: 50px 0 100px;
border-radius: 20px;
}

@media all and (max-width : 767px ){
.eventbox_inner {
padding: 20px 0 50px;
}
}

/*-------------------------------------------------
SNSリンクボタン
-------------------------------------------------*/

.sns-links {
 display: flex;
 flex-wrap: wrap;
 margin: 18px 0;
}
.sns-links li {
 width: 70px;
}
.sns-links li:nth-child(n+2) {
 margin-left: 10px;
}
.sns-links li a {
 display: block;
 padding: 0 5px;
 border-radius: 4px;
 text-align: center;
 transition: all .4s ease;
}
.sns-links li:nth-child(1) a {
 background-color: #3B5A9A;
}
.sns-links li:nth-child(2) a {
 background-color: #2CA7E0;
}
.sns-links li:nth-child(3) a {
 background-color: #28C00B;
}
.sns-links li a:hover {
 opacity: .8;
}

@media screen and (max-width: 767px) {
.sns-links {
margin: 10px 0;
}
.sns-links li {
width: 60px;
}
.sns-links li:nth-child(n+2) {
margin-left: 10px;
}
}

/*-------------------------------------------------
見出しタイトル
-------------------------------------------------*/

.page_event_dtl .event_title {
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-size: 2.2rem;
line-height: 100%;
letter-spacing: 0.2em;
padding: 0 20px 10px 5px;
border-bottom: solid 1px #DDDDDD;
margin-bottom: 20px;
}

@media all and (max-width : 820px ){
.page_event_dtl .event_title {
font-size: 2.0rem;
letter-spacing: 0.1em;
padding: 0 20px 10px 5px;
}
}

@media all and (max-width : 767px ){
.page_event_dtl .event_title {
font-size: 1.4rem;
letter-spacing: 0.1em;
padding: 0 0px 10px 0px;
margin-bottom: 10px;
}
}


.detail_area_icon {
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-size: 1.3rem;
padding: 5px 20px;
background-color: #4496B3;
text-align: center;
display: inline-block;
color: #fff;
border-radius: 5px;
margin-bottom: 30px;
letter-spacing: 0.1em;
}
.event_head_box {
border: solid 3px #4496B3;
border-radius: 15px;
padding: 15px 50px 30px;
margin-bottom: 40px;
}
.event_outline {
font-size: 1.5rem;
padding: 15px 20px 15px 10px;
border-bottom: dotted 1px #ccc;
display: flex;
flex-wrap: wrap;
}
.event_outline dt {
padding-left: 30px;
}
.page_event_dtl .event_date {
background-image:url("../img/common/icon_calendar.svg");
background-repeat: no-repeat;
background-position: left center;
}
.page_event_dtl .event_place {
background-image:url("../img/common/icon_map.svg");
background-repeat: no-repeat;
background-position: left center;
}
.event_outline dd {
margin-left: 10px;
}

@media all and (max-width : 767px ){

.detail_area_icon {
padding: 5px 10px;
margin-bottom: 20px;
letter-spacing: 0.05em;
font-size: 1.0rem;
}
.event_head_box {
padding: 10px 15px 15px;
margin-bottom: 15px;
}
.event_outline {
font-size: 1.2rem;
padding: 15px 0px 15px 10px;
display: flex;
flex-wrap: wrap;
flex-direction: column;
}
.event_outline:last-child {
border-bottom: none;
}
.event_outline dt {
padding-left: 22px;
font-weight: 700;
margin-bottom: 10px;
}
.event_outline dd {
margin-left: 0px;
}
}

/*-------------------------------------------------
slide box
-------------------------------------------------*/

.slide-box {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 position: relative;
 padding: 0;
	margin-bottom: 50px;
}
.slide {
 position: relative;
 width: 80%;
 margin: 0;
 padding: 0;
}
.slide .item {
 position: relative;
 overflow: hidden;
}
.slide .item::before {
 content: "";
 display: block;
}
.slide .item img {
width: 100%;
height: 525px;
object-fit: contain;
}
.slide > .slick-list, 
.slide > .slick-list > .slick-track, .slide > .slick-list > .slick-track > .slick-slide > div {
 position: relative;
 height: 100%;
}
@media screen and (max-width: 767px) {
.slide-box {
	margin-bottom: 20px;
}
.slide {
width: 100%;
}
	.slide .item img {
height: 207px;
}
}
/* slide-navigation */
.slide-navigation {
 line-height: 0;
 position: relative;
 width: 18%;
 margin: 0;
 padding: 40px 15px;
 border: 1px solid #ddd;
 overflow: hidden;
}
.slide-navigation .item {
 position: relative;
 cursor: pointer;
 margin-top: 10px;
}
.slide-navigation .item .image {
 position: relative;
 overflow: hidden;
}
@media screen and (min-width: 768px) {
.slide-navigation .item .image {
  width: 144px;
  height: 92px;
 }
}
@media screen and (max-width: 767px) {
.slide-navigation .item .image {
  padding-top: 63.5%;
 }
}
.slide-navigation .item .image img {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
 height: 100%;
 object-fit: cover;
 font-family: 'object-fit: cover; object-position: 50% 50%;';
}
.slide-navigation .slick-list {
 overflow: inherit;
}
.slide-navigation .item .image::after {
 position: absolute;
 top: 0;
 left: 0;
 display: block;
 width: 100%;
 height: 100%;
 content: "";
 opacity: 0.5;
 background: #000;
}
.slide-navigation .slick-current .image::after {
 opacity: 0;
}

@media screen and (max-width: 767px) {
.slide-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 2%;
  padding: 0 15px;
  border: none;
 }
.slide-navigation .item {
  width: 32%;
  margin-right: 5px;
  margin-left: 5px;
 }
.slide-navigation .item:last-child {
  margin-right: 0;
 }
.slide-navigation .slick-list {
  padding: 0 !important;
 }
}
/* slick */
.slick-vertical .slick-slide {
 border: 0 solid transparent;
}
.slick-arrow {
 z-index: 999;
}
.slick-prev::before,
.slick-next::before {
 color: #000;
}
.slick-prev {
 top: 25px;
 bottom: auto;
 left: 0;
 right: 0;
 width: 16px;
 height: 16px;
 margin: auto;
}
.slick-next {
 top: auto;
 bottom: 20px;
 left: 0;
 right: 0;
 margin: auto;
}
.slick-prev::before,
.slick-next::before {
 content: "";
 position: absolute;
 top: 0;
 bottom: 0px;
 margin-top: auto;
 margin-bottom: auto;
 width: 8px;
 height: 8px;
}
.slick-prev::before {
 border-top: 1px solid #111;
 border-right: 1px solid #111;
 transform: rotate(-45deg);
}
.slick-next::before {
 border-bottom: 1px solid #111;
 border-left: 1px solid #111;
 transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
.slick-prev {
  top: 20px;
  bottom: 0;
  right: auto;
  left: 0;
 }
.slick-next {
  top: 27px;
  bottom: 0;
  right: 2px;
  left: auto;
 }
.slick-prev:before {
  transform: rotate(-135deg);
 }
.slick-next:before {
  transform: rotate(-135deg);
 }
}
.slide-box .slide .item p {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
display: block;
background: rgba(0, 0, 0, .7);
padding: 10px 5px;
color: #fff;
font-size: 1.2rem;
text-align: center;
}
.desc_txt {
line-height: 180%;
}

@media all and (max-width : 767px ){
.slide-box .slide .item p {
padding: 8px 5px;
font-size: 1.0rem;
}
.desc_txt {
font-size: 1.2rem;
}
}

/*-------------------------------------------------
開催概要
-------------------------------------------------*/

.sec_title_wrap {
display: flex;
align-items: flex-end;
margin-bottom: 25px;
margin-top: 80px;
padding: 0 10px 15px 5px;
border-bottom: dotted 1px #ddd;
}
.sec_title_wrap .sec_jp_title {
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-size: 1.8rem;
letter-spacing: 0.2em;
line-height: 100%;
margin-right: 15px;
}
.sec_title_wrap .sec_en_title {
font-family: 'Quicksand', sans-serif;
font-weight: 700;
color: #1D4781;
font-size: 1.2rem;
line-height: 100%;
letter-spacing: 0.05em;
}

@media all and (max-width : 767px ){
.sec_title_wrap {
margin-bottom: 20px;
margin-top: 40px;
padding: 0 10px 15px 5px;
}
.sec_title_wrap .sec_jp_title {
font-size: 1.4rem;
letter-spacing: 0.1em;
margin-right: 10px;
}
.sec_title_wrap .sec_en_title {
font-size: 1.0rem;
}
}

.outline_list_wrap {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.outline_list {
width: 47.9%;
padding: 10px 10px 25px 10px;
border-bottom: dotted 1px #ccc;
margin-bottom: 20px;
display: flex;
align-items: center;
}
.outline_list dt {
font-weight: 700;
width: 25%;
white-space: nowrap;
}

@media all and (max-width : 1024px ){
.outline_list {
font-size: 1.3rem;
}
.outline_list dt {
width: 30%;
}
}

@media all and (max-width : 767px ){
.outline_list_wrap {
display: flex;
flex-wrap: wrap;
flex-direction: column;
}
.outline_list {
width: 100%;
padding: 0px 10px 15px 10px;
border-bottom: dotted 1px #ccc;
margin-bottom: 15px;
display: flex;
align-items: flex-start;
flex-direction: column;
font-size: 1.2rem;
}
.outline_list dt {
width: 100%;
margin-bottom: 10px;
}

}


/*-------------------------------------------------
アクセスマップ
-------------------------------------------------*/

.gmap {
height: 0;
overflow: hidden;
padding-bottom: 44.18%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.gmap_wrap {
padding: 2px;
border: solid 1px #ddd;
margin-bottom: 80px;
}

@media all and (max-width : 767px ){
.gmap_wrap {
margin-bottom: 30px;
}
}