@charset "utf-8";


/*------------ bxSlider adjust ----------------*/

.home .bx-wrapper {
	box-shadow: none;
	border: none;
	background: #c7e4e6;
	margin-bottom: 0;
	overflow: hidden;
    max-height: 450px;
}
.home .bx-wrapper img {
	max-width: initial;
	width: 100%;
}
.home .title_kv > div {
    max-width: 1400px;
    right: 0;
    left: 0;
    margin: auto;
}

/*------------ campaign area ----------------*/

.campaign {
	background: #F3DBA9;
	padding: 40px 0;
	margin-bottom: 0;
}
.campaign .contents_section {
	margin-bottom: -20px;
}
.campaign li {
	font-size: 25px;
	font-size: 2.5rem;
    padding: 15px 30px 10px;
    box-sizing: border-box;
    background: #fff;
    margin-bottom: 20px;
    border-radius: 10px;
	line-height: 1.2;
	color: #f22;
}
.campaign .special_notes {
    font-size: 1.5rem;
    line-height: 1.6;
    margin: 1em 2em 0;
    color: #333;
}

.campaign .special_notes .catch {
    text-align: center;
    font-weight: bold;
    color: red;
    font-size: 110%;
    margin-bottom: 0.3em;
}
.campaign .special_notes em {
    color: #333;
}

.seasonal_motto {
    display: flex;
    align-items: center;
	justify-content: center;
	margin-bottom: 1em;
}
.seasonal_motto img {
	width: 10%;
	min-width: 75px;
}
.motto {
    text-align: center;
    font-size: 25px;
	font-size: 2.5rem;
	line-height: 1.4;
    color: #f22;
    font-weight: bold;
	margin: 0 20px;
}

@media screen and (max-width: 768px) {
	
	.campaign li {
		line-height: 1.4;
	}
	
} /* end media query */

@media screen and (max-width: 479px) {
	
	.campaign li {
		font-size: 18px;
		font-size: 1.8rem;
		padding: 10px 15px 5px;
		margin-bottom: 10px;
	}
	.campaign .special_notes {
    	margin: 1em 0 0;
	}
	.motto {
		font-size: 1.8rem;
	}
	.seasonal_motto img {
		display: none;
	}
	
} /* end media query */

/*------------ tagline ----------------*/

.tagline {
    padding-top: 5em;
}
h2.catch {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	border-bottom: none;
	text-align: center;
	line-height: 1.6;
	color: #222;
    /*position: relative;*/
}
h2.catch::after {
    content: '';
    display: block;
    width: 20%;
    height: 6px;
    background: #2f99a2;
    margin: .6em auto 0;
}

/*------------ score up report ----------------*/

.score_report {
    padding: 0 0 3em;
    /*background: #e0f0f1;*/
}
.score_report_header {
    text-align: center;
}

.score_report_header h3 {
    border-bottom: none;
    margin-bottom: .5em;
}
.score_report_header h3 em {
    color: #ea5514;
}

.score_report_header h3 small {
    display: inline-block;
    background: #ea5514;
    padding: 0.6em 1.2em 0.4em;
    position: relative;
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    border-radius: 10px;
    margin-bottom: 1em;
	left: -19%;
}
.score_report_header h3 small::after {
    position: absolute;
    content: '';
    top: 100%;
    left: 45%;
    border: 7px solid transparent;
    border-top: 13px solid #ea5514;
    width: 0;
    height: 0;
}
.lead {
    font-weight: bold;
    font-size: 110%;
}

.score_report_contents {
    margin-bottom: 2em;
}
.score_report_midtitle {
    text-align: center;
    margin-bottom: 1em;
}
.score_report_midtitle span {
    display: inline-block;
    padding: 0 1em;
    border-bottom: 1px dotted #999;
}

/*---slick style override */

/* 各スライダーアイテムのコンテンツ量により高さに差が出るため、フロートをやめてflexに変更*/

.slick-slider .slick-track, 
.slick-slider .slick-list {
    display: flex;
    /*箱の下線が消えるバグを防ぐ */
    padding-bottom: 5px;
}

.slick-slide {
    float: none;
}

.slick-prev:before, .slick-next:before {
    font-size: 40px;
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.3));
    opacity: 1;
    color: #c7e4e6;
}

.slick-prev, .slick-next {
  z-index: 5;
}

.slick-prev {
  left: 24px;
}

.slick-next {
  right: 50px;
}

/*--- ここまで*/


.score_report_item {
    border: 2px solid #2f99a2;
    background: #fff;
    padding: 0;
    width: 100%;
    /*max-width: 300px;*/
    margin: 0 1em;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 3px 3px 1px rgba(0,0,0,0.1);
}
.score_item_title {
    font-size: 1.8rem;
    font-weight: bold;
    text-align: center;
    color: #fff;
    line-height: 1;
    background: #2f99a2;
    padding: .6em 1em;
    margin-bottom: 1em;
}
.score_category {
    display: flex;
    justify-content: space-between;
    margin: 0 1em 1em .5em;
    align-items: flex-start;
}
.score_category_title {
    width: 24%;
}
.score_detail_list {
    width: 73%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    font-size: 13px;
    line-height: 1.3;
}
.score_detail_list dt {
    width: 65%; 
    font-weight: bold;
    margin-bottom: .3em;
}
.score_detail_list dd {
    width: 30%;
    text-align: right;
    white-space: nowrap;
    position: relative;
    top: .3em;
}
.score_detail_list dd em {
    font-size: 160%;
    color: #ea5514;
}

.score_detail_list dd::after {
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-top: 2px;
}
.score_high dd::after {
    background: url("../img/icon_sfx_high.png") no-repeat;
    background-size: contain;
}
.score_up dd::after {
    background: url("../img/icon_sfx_up.png") no-repeat;
    background-size: contain;
}


/* slickの各要素にmin-widthやmax-widthを設定すると、バグで周変わりで流れがガタつくため、非常に見にくくなるところだけ設定　*/

@media screen and (max-width: 768px) {
    
    .score_report_item {
        min-width: 300px;
    }
	
} /* end media query */

@media screen and (max-width: 480px) {
    .score_report_item {
        min-width: auto;
    }
	
} /* end media query */

/*------------ contents guide ----------------*/

.contents_guide {
	display: flex;
	max-width: 1400px;
    margin: 0 auto 70px;
    /*border-top: 2px solid #2f99a2;
    border-bottom: 2px solid #2f99a2;*/
}
.contents_guide .guide_box {
	width: 50%;
}
.contents_guide .half_left {
	background: #fff;
}
.contents_guide .half_right {
	background: url(../img/home_guide_03.jpg) no-repeat;
	background-size: cover;
}
.contents_guide li {
	display: flex;
	height: 50%;
}
.contents_guide li > * {
	width: 50%;
}
.contents_guide li figure img {
	width: 100%;
}
.contents_guide .guide_link a {
	display: flex;
	height: 100%;
	background: #34949C;
	align-items: center;
	padding: 20px;
	text-decoration: none;
	color: white;
	text-align: center;
	
}
.contents_guide .guide_link a:hover {
	opacity: 0.85;
}
.contents_guide .guide_link dl {
	width: 100%;
}
.contents_guide .guide_link dt {
	font-weight: bold;
    font-size: 2.5vw;
	margin-bottom: 0;
	line-height: 1.3;
}
.contents_guide .guide_link dd {
	font-size: 13px;
	font-size: 1.3rem;
	font-feature-settings: "palt";
}

/*----- 個別のguide_link */

.half_left .guide_link:last-child a {
	background: #18646E;
}
.half_right .guide_link:first-child a {
	background: rgba(5,170,189,0.9);
}
.half_right .guide_link:last-child a {
	background: rgba(255,255,255,0.9);
	color: #333;
}


@media screen and (max-width: 768px) {
	.contents_guide .guide_link dt {
    
    	font-size: 3vw;
	}
	
} /* end media query */


@media screen and (max-width: 400px) {
	.contents_guide {
		display: block;
	}
	.contents_guide .guide_box {
		width: 100%;
	}
	.half_right .guide_link {
		padding-bottom: 50%;
		position: relative;
	}
	.half_right .guide_link a {
		position: absolute;
		width: 100%;
		height: 100%;
	}
	.contents_guide .guide_link a {
    	padding: 10px;
	}
	.contents_guide .guide_link dt {
    	font-size: 7vw;
	}
	
} /* end media query */


/*------------ info ----------------*/

.info h2 small {
    display: block;
    color: #2f99a2;
    font-size: 55%;
    font-weight: bold;
    margin-left: 0.1em;
}

/*.info ul {
	margin-left: 2em;
	margin-bottom: 1em;
}
.info ul li {
	list-style: disc;
	margin-left: 1em;
}*/
.info ul.attention {
	border: 2px solid #c7e4e6;
    padding: 1em 1em 0.8em 1.5em;
    margin-left: 1em;
    margin-right: 1em;
    border-radius: 8px;
    color: #2f99a2;
    font-weight: bold;
	margin-bottom: 1em;
}

.home .page_content .col2 > * {
	width: 48%;
}

@media screen and (max-width: 600px) {
	
	.home .page_content .col2 {
		display: block;
	}
	.home .page_content .col2 > * {
		width: 100%;

	}
} /* end media query */


/*------ info_sub area */

.current_info {
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}
.info_sub {
	width: 70%;
}
.sns_feed {
	width: 28%;
}
.feed_box {
	position:relative;
    width:100%;
    height:0;
    padding-top:500px;
	max-width: 280px;
	margin: 0 auto;
}
.feed_box iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.info_item {
	border: 1px dotted gray;
	padding: 25px 25px 10px;
	margin-bottom: 2em;
	/*display: flex;
	justify-content: space-between;
	align-items: center;*/
    position: relative;
}
.info_item.no-flex {
    display: block;
}
.info_item:last-child {
	margin-bottom: 0;
}
.current_info h3 {
    font-size: 1.8rem;
    font-weight: bold;
}
.current_info h3 em {
	font-weight: bold;
}
.current_info h4 {
    font-weight: bold;
	font-size: 1.5rem;
    color: #ea5514;
	display: inline-block;
	border-top: 2px solid #ea5514;
	border-bottom: 2px solid #ea5514;
    margin-bottom: 1em;
    padding: 0.3em 0.4em 0;
    margin-top: 0;
}
.current_info h5 {
    font-weight: bold;
	font-size: 1.5rem;
    margin-bottom: 3px;
    /*margin-top: 20px;*/
	color: #2f99a2;
}
.current_info h5::before {
	font-family: "Font Awesome 5 Free";
    content: "\f05a";
    font-weight: 900;
	font-size: 130%;
    margin-right: 5px;
    position: relative;
    bottom: -2px;
}

.current_info h6 {
	font-weight: bold;
	color: #2f99a2;
}
.current_info h6 em {
	color: #ea5514;
}
small.sub_catch {
    font-size: 95%;
    color: #5088ab;
}

.current_info hr {
    margin: 2.5em;
}
.info_item .text_box {
	width: 55%;
}
/*.info_item figure {
	width: 40%;
}*/
.info_item figure.floatright,
.info_item figure.floatleft {
	width: 40%;
}
.info_item figure.figure_sml {
	width: 30%;
}
.info_item figure.full {
    width: 100%;
    margin: 0 auto 2em;
    max-width: 400px;
}
.info_feature {
	border: 3px solid #c7e4e6;
	padding: 1em;
	margin-bottom: 2em;
	border-radius: 15px;
}
.info_feature strong {
	color: #ea5514;
	font-size: 110%;
}

.closing {
    text-align: center;
    font-weight: bold;
    border-top: 1px dotted #5088ab;
    padding-top: 1em;
}
.info_catch {
	text-align: center;
	font-weight: bold;
}

@media screen and (max-width: 768px) {
	.info_item {
    	display: block;
	}
	.info_item .text_box {
    	width: 100%;
	}
	.info_item figure {
    	width: 80%;
		/*margin: 20px auto 0;*/
	}
	.info_item figure.photo_gallery {
		width: 100%;
		margin: 0;
	}
	
} /* end media query */


@media screen and (max-width: 600px) {
	.current_info {
		display: block;
	}
	.current_info > * {
		width: 100%;
	}
	.info_item {
    	padding: 15px;
	}
	.info_item:last-child {
		margin-bottom: 2em;
	}
	
	
} /* end media query */

@media screen and (max-width: 480px) {
	.info_item .floatleft.tiny_sp, 
	.info_item .floatright.tiny_sp {
    	width: 90%;
        margin: 1em auto;
}
	
} /* end media query */


/*------ photo gallery (lightbox使用) */

.photo_gallery {
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
}
.gallery_caption {
	width: 100%;
}
.gallery_item {
	width: 25%;
	padding: 0 .25em;
	margin-bottom: .5em;
}

@media screen and (max-width: 768px) {
	.info_item figure.gallery_figure {
		width: 100%;
	}
	
} /* end media query */

@media screen and (max-width: 480px) {
	.gallery_item {
		width: 33.3%;
	}
	
} /* end media query */


/*------ banner area */
.banner_area > div {
    margin-bottom: 20px;
}
.banner_area .col2 > div {
	margin-bottom: 15px;
}

@media screen and (max-width: 480px) {
	
	.banner_area > div {
		margin-bottom: 15px;
	}
	.page_content h2.catch {
		line-height: 1.4;
	}
	
} /* end media query */



/*------------ news ----------------*/

#news {
	height: 250px;
    overflow-y: auto;
    border: 2px solid #2f99a2;
    margin: 2em auto;
    padding: 0 5px;
}
#information > div {
    border-bottom: 1px dotted #ccc;
    padding: 10px;
    margin-bottom: 5px;
}
#information dt {
    float: left;
    width: 15%;
    padding: 10px 0 0 10px;
    color: #5088ab;
    font-style: italic;
	font-weight: bold;
}
#information dd {
    float: right;
    width: 82%;
    padding: 10px 10px 0 0;
}
#information > div::after {
    content: "";
    display: block;
    clear: both;
    height: 0;
}

@media screen and (max-width: 768px) {
	
	#information dt {
		float: none;
		width: 100%;
		padding: 0;
	}
	#information dd {
		float: none;
		width: 100%;
		padding: 0;
	}
	
} /* end media query */



/*------------ 一時的なルール ----------------*/