@import url("https://use.fontawesome.com/releases/v5.8.1/css/all.css");
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP|Noto+Serif+JP&display=swap");

/* ===========================
font
============================*/
.gothic { font-family: 'Noto Sans JP', sans-serif; }
.mincho { font-family: 'Noto Serif JP', serif; }

/* ===========================
layout
============================*/
.wrapper { max-width: 950px; margin: 0 auto; padding-left: 10px; padding-right: 10px; }

/* ===========================
nav
============================*/
@media screen and (min-width: 940px){
.gnav { border-top: 2px #025ca1 solid; border-bottom: 2px #025ca1 solid; margin: 10px auto 0 auto;
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #0199d6),
		color-stop(1, #0079b2)
	);
	background-image: -o-linear-gradient(bottom, #0079b2 0%, #0199d6 100%);
	background-image: -moz-linear-gradient(bottom, #0079b2 0%, #0199d6 100%);
	background-image: -webkit-linear-gradient(bottom, #0079b2 0%, #0199d6 100%);
	background-image: -ms-linear-gradient(bottom, #0199d6 0%, #0079b2 100%);
	background-image: linear-gradient(to bottom, #0199d6 0%, #0079b2 100%);
}
.gnav ul { max-width: 970px; margin: 0 auto; border-left: 1px #025ca1 solid; }
.gnav ul li { float: left; width: 12.5%; text-align: center; }
.gnav ul li a { display: block; color: #FFF; text-decoration: none; font-size: 106%; font-weight: bold; padding: 10px 5px; border-right: 1px #025ca1 solid; line-height: 120%; }
.gnav ul li a:hover {	background: #02304b; color: #FFF; }
.gnav ul li span { display: block; }
.drawer-toggle { display: none; }
}

@media screen and (max-width: 939px){
.gnav { display: none; }
}

@media screen and (min-width: 940px){
.site_navi { border-bottom: 10px #d1cdaf solid; }
.site_navi li { float: left; width: 14.2%; text-align: center; }
.site_navi li a { display: block; -moz-border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; border-top: 2px #CCC solid; border-left: 2px #CCC solid; border-right: 2px #CCC solid; border-bottom: 2px #ececec solid; padding: 10px 5px; font-size: 124%; margin-top: 6px; margin-right: 1%; text-decoration: none; color: #000; font-weight: bold; color: #555;
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #FFF),
		color-stop(1, #ececec)
	);
	background-image: -o-linear-gradient(bottom, #ececec 0%, #FFF 100%);
	background-image: -moz-linear-gradient(bottom, #ececec 0%, #FFF 100%);
	background-image: -webkit-linear-gradient(bottom, #ececec 0%, #FFF 100%);
	background-image: -ms-linear-gradient(bottom, #FFF 0%, #ececec 100%);
	background-image: linear-gradient(to bottom, #FFF 0%, #ececec 100%);
}
.site_navi li a:hover { font-weight: bold; border: 2px #d0cdb8 solid; color: #383629; padding: 13px 5px; margin-top: 0;
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #fbf8e6),
		color-stop(1, #d1cdaf)
	);
	background-image: -o-linear-gradient(bottom, #d1cdaf 0%, #fbf8e6 100%);
	background-image: -moz-linear-gradient(bottom, #d1cdaf 0%, #fbf8e6 100%);
	background-image: -webkit-linear-gradient(bottom, #d1cdaf 0%, #fbf8e6 100%);
	background-image: -ms-linear-gradient(bottom, #fbf8e6 0%, #d1cdaf 100%);
	background-image: linear-gradient(to bottom, #fbf8e6 0%, #d1cdaf 100%);
}
.site_navi .select a { font-weight: bold; border: 2px #d1cdaf solid; margin-top: 0px; color: #383629;  padding: 13px 5px;
	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #fffdeb),
		color-stop(1, #d1cdaf)
	);
	background-image: -o-linear-gradient(bottom, #d1cdaf 0%, #fffdeb 100%);
	background-image: -moz-linear-gradient(bottom, #d1cdaf 0%, #fffdeb 100%);
	background-image: -webkit-linear-gradient(bottom, #d1cdaf 0%, #fffdeb 100%);
	background-image: -ms-linear-gradient(bottom, #fffdeb 0%, #d1cdaf 100%);
	background-image: linear-gradient(to bottom, #fffdeb 0%, #d1cdaf 100%);
}

}

@media screen and (max-width: 939px){
.drawer-nav ul li { padding-left: 10px; padding-right: 10px; border-bottom: 1px #E0E0E0 solid; }
.drawer-nav ul li a { display: block; padding: 15px 10px 15px 20px; text-decoration: none; background: url(../images/icon/arrow03.png) no-repeat left center; }
}

.page_nav { display: flex; -js-display: flex; flex-wrap: wrap; }
.page_nav li { margin-bottom: 5px; }
.page_nav a { display: block; padding: 8px 10px; background: #FFF; border: 2px #d6d4d4 solid; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; color: #333333; text-decoration: none; font-size: 130%; text-align: center; }
.page_nav a:hover { background: #547d0c; color: #FFFFFF; border: 2px #547d0c solid; }
.page_nav .select a { background: #547d0c; color: #FFF; border: 2px #547d0c solid; }

@media screen and (min-width: 700px){
.page_nav li { width: 19%; margin-right: 1%; }
}

@media screen and (max-width: 699px){
.page_nav li { width: 48%; margin-left: 1%; margin-right: 1%; }
.page_nav a { padding: 10px 10px; background: #FFF; margin-right: 5px; font-size: 118%; }
}

/* ===========================
main_box
============================*/
.narrow_wrapper{max-width:1200px;margin:0 auto;}

@media screen and (min-width: 940px){
header { margin-top: 20px; }
}
@media screen and (max-width: 939px){
header { background: #f6f5f0; padding-top: 2px; padding-bottom: 6px; border-bottom: 0px #CCC solid; }
}
footer { margin-top: 50px; }
.content { padding: 0 10px; }

/* ===========================
header
============================*/
.logo { float: left; }
.logo p { font-size: 82%; text-align: center; }
.service_logo { text-align: center; margin: 30px 0 10px 0; }
.big_banner { float: right; }

.page_title { margin-top: 15px; color: #999; }
.breadcrumb { display: flex; flex-wrap: wrap; margin-top: 3px; color: #999; }
.breadcrumb li { margin-right: 3px; }

@media screen and (min-width: 940px){
.logo { padding-top: 20px; }
.service_logo img { width: 350px; }
}

@media screen and (max-width: 939px){
.logo { padding-top: 5px; }
.logo img { max-width: 160px; }
.logo p { display: none; }
.service_logo { border-bottom: 5px #e0e0e0 solid; padding-bottom: 15px; }
.service_logo img { width: 300px; }
}

@media screen and (max-width: 949px){
.big_banner { display: none; }
}

/* ===========================
footer
============================*/
footer { background: #EEE; }
footer .f_box { margin: auto; max-width: 900px; padding: 20px 25px; }
footer .f_box_wide { margin: auto; max-width: 1150px; padding: 20px 25px; }
footer ul { display: flex; -js-display: flex; flex-wrap: wrap; margin-bottom: 8px; }
footer ul li { padding-right: 13px; }
.footer_banner div { margin: auto; }
.footer_banner_sma div { margin: auto; }

@media screen and (max-width: 700px){
footer ul { display: block; }
footer ul li { padding-bottom: 10px; }
footer ul li a { display: block; }
}

@media screen and (min-width: 950px){
.footer_banner_sma { display: none; }
}

@media screen and (max-width: 949px){
.footer_banner { display: none; }
}

/* ===========================
list
============================*/
.link_list a { display: block; text-align: center; text-decoration: none; color: #333; padding: 8px 5px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 2px #EEE solid; }
.link_list a:hover { background: #000; color: #FFF; }

.c_list { background: url("../images/common/icon_point.png") left top no-repeat; padding-left: 20px; margin-bottom: 10px; line-height: 125%; }

@media screen and (min-width: 750px){
.link_list { display: flex; -js-display: flex; flex-wrap: wrap; }
.link_list dd { width: 48%; margin: 3px 1%; }
}

@media screen and (max-width: 749px){
.link_list dd { margin-bottom: 8px; }
}

/* ===========================
pagetop
============================*/
@media screen and (min-width: 949px) { 
	#pagetop { position: fixed; bottom: 20px; right: 20px; font-size: 88%; }
	#pagetop a { background: #666; text-decoration: none; color: #fff; width: 100px; padding: 15px 8px 15px 8px; text-align: center; display: block; border-radius: 15px; line-height: 130%; }
	#pagetop a:hover { text-decoration: none; background: #999; }
}

@media screen and (max-width: 948px) {
	#pagetop { display: none; }
	#pagetop a { display: none; }
}

/* ===========================
common
============================*/
.m_image_bg_wide { margin: auto; }
.m_image_bg_wide p { margin: auto; max-width: 1200px; }
.m_image_bg_wide img { width: 100%; }

.m_image_bg_normal { margin: auto; }
.m_image_bg_normal p { margin: auto; max-width: 950px; }
.m_image_bg_normal img { width: 100%; }

.pagenav li { width: 100%; text-align: center; border: 1px #FFF solid; font-size: 1.1rem; margin-bottom: 5px; }
.pagenav li a { background: #eeeadc; color: #444; display: block; text-decoration: none; padding: 10px 5px; border-radius: 3px; }
.pagenav li a:hover { background: #333; color: #FFF; }

@media screen and (min-width: 750px) {
	.pagenav { display: flex; flex-wrap: nowrap; }
	.pagenav li a { padding: 20px 5px; }
}

/* ===========================
premiere day
============================*/
.main_img { background: #000; margin-bottom: 10px; }
.main_img p { margin: auto; max-width: 950px; }
.main_img img { width: 100%; }

.p_layout img { width: 100%; border-radius: 5px; }
.p_layout02 { display: flex; justify-content: space-between; flex-wrap: wrap; }
.p_layout02 p { margin-top: 5px; text-align: center; }
.p_layout02 li { margin-bottom: 20px; }
.p_layout02 img { width: 100%; border-radius: 5px; }

.p_detail { width: 100%; border-spacing: 10px; }
.p_detail th { background: #000; color: #FFF; padding: 5px 1%; border-radius: 10px; text-align: center; width: 25%; }
.p_detail td { padding: 5px 2%; }

.no_info { border: 8px solid #CCC; padding: 20% 10%; text-align: center; font-size: 106%; color: #999; }

@media screen and (min-width: 750px) {
.p_layout { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; }
.p_layout li { width: 49.5%; }
.p_layout li.child1 { order: 1; }
.p_layout li.child2 { order: 2; }
.p_layout02 li { width: 32%; }
}

@media screen and (max-width: 749px) {
	h2 span { display: block; }
	h3 span { display: block; }
	.p_layout { margin-bottom: 50px; }
	.p_layout li { margin-bottom: 10px; }
	.p_layout02 li { width: 49%; }
}

/* ===========================
vgcup
============================*/
.vgcup_area { font-size: 1.5rem; text-align: center; border: 5px #DDD solid; padding: 10px; }
.vgcup_layout li { margin-bottom: 20px; }
.vgcup_layout li img { width: 100%; border-radius: 3px; }
.vgcup_layout li h3 { text-align: center; }
.vgcup_layout li h3 font { font-size: 0.9rem; }
.vgcup_layout .inner_box { background: #EEE; border-radius: 5px; }
.vgcup_layout .inner_box div { padding: 15px; }
.vgcup_layout .inner_box div .explain { margin-top: 5px; font-size: 0.9rem; color: #444; }
.vgcup_layout .inner_box .day { background: #FFF; padding: 10px 5px; text-align: center; font-size: 1.2rem; margin-bottom: 10px; border-radius: 3px; letter-spacing: 1.3px; }

.vgcup_detail { width: 100%; border-spacing: 5px; }
.vgcup_detail th { background: #eeece1; text-align: center; padding: 15px 5px; width: 30%; border-radius: 2px; }
.vgcup_detail td { background: #FFF; padding: 10px; }

@media screen and (min-width: 750px) {
	.vgcup_layout { display: flex; flex-wrap: wrap; justify-content: space-between; }
	.vgcup_layout li { width: 49%; }
}

/* ===========================
staygolf
============================*/
.sg_bgimg { background: url("../staygolf/images/back_img.jpg")  no-repeat center top; background-size: cover; background-attachment: fixed; }
.sg_wrapper { max-width: 1200px; margin: 0 auto; padding-left: 10px; padding-right: 10px; }
.sg_footer { max-width: 1220px; margin: 0 auto; }
.sg_slider_img div img { width: 100%; }
.sg_wrapper .pict { display: flex; flex-wrap: wrap; }
.sg_wrapper .pict li { margin-right: 5px; margin-bottom: 5px; padding: 5px 10px; border-radius: 20px; }

.pts_img { display: flex; justify-content: space-between; }
.pts_img li { width: 49%; margin-bottom: 10px; }

.area_select dl { display: flex; justify-content: space-between; }
.area_select dl dt { width: 16%; text-align: center; border: 1px #CCC solid; padding: 15px 2% 12px 2%; margin-top: 3px; margin-bottom: 3px; font-weight: bold; border-radius: 5px; background: #FFF; }
.area_select dl dd { width: 78%; }
.area_select dl dd a { display: block; float: left; margin-right: 5px; padding: 15px 30px; text-decoration: none; background: #005e8f; color: #FFF; margin-top: 5px; margin-bottom: 3px; border-radius: 5px; }
.area_select dl dd a:hover { background: #000; }

.video { position: relative; width: 100%; padding-top: 56.25%; }
.video iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

@media screen and (max-width: 600px) {
	.area_select dl { display: block; margin-bottom: 10px; }
	.area_select dl dt { width: 96%; margin-bottom: 10px; }
	.area_select dl dd { width: 100%; }
	.area_select dl dd a { width: 20%; padding: 10px 2%; margin-right: 1%; text-align: center; }
	.pts_img { display: block; }
	.pts_img li { width: 100%; }
}

/* ===========================
one_promo
============================*/
.gunma_bg{background:url("../one_promo/images/pr_bg01.jpg") no-repeat left bottom;background-size:cover;padding:100px 10%;}
.ibaraki_bg{background:url("../one_promo/images/pr_bg02.jpg") no-repeat left bottom;background-size:cover;padding:100px 10%;}
.tochigi_bg{background:url("../one_promo/images/pr_bg03.jpg") no-repeat center bottom;background-size:cover;padding:100px 10%;}
.area_box{background-color:rgba(255,255,255,0.8);padding:50px;border-radius:15px;}

@media screen and (max-width:750px){
	.gunma_bg{padding:30px 5%;}
	.ibaraki_bg{padding:30px 5%;}
	.tochigi_bg{padding:30px 5%;}
	.area_box{padding:30px;}
}

/* ===========================
ranking
============================*/
.ranking a,.area_ranking a{text-decoration:none;color:#333;}
.ranking a:hover,.area_ranking a:hover{color:#D00000;}
.ranking div{margin-bottom:15px;}
.area_ranking div{font-size:1.05rem;margin-bottom:13px;}
.area_ranking li{margin-bottom:30px;}
.higher{font-size:1.3rem;}
.low{font-size:1.2rem;}
.higher span{font-size:1.0rem;}
.low span{font-size:1.0rem;}
.no01{color:#af9800;font-weight:bold;}
.no02{color:#a0a0a0;font-weight:bold;}
.no03{color:#ac6b25;font-weight:bold;}
.top5{color:#555;font-weight:bold;}

@media screen and (max-width:650px){
	.higher{font-size:1.1rem;}
	.higher span{font-size:0.9rem;}
	.low{font-size:1.0rem;}
	.low span{font-size:0.8rem;}
}

/* ===========================
kizuna
============================*/
.w_kizuna{background:url("../kizuna/images/what_bg.jpg") left top no-repeat;background-size:cover;}
.w_kizuna div{max-width:1150px;margin:auto;padding:7% 15%;}
.w_kizuna ul{display:flex;justify-content:space-between;flex-wrap:wrap;}
.w_kizuna ul li{width:24%;}
.w_kizuna ul li img{width:100%;border-radius:5px;}

.kizuna_navi{display:flex;letter-spacing:0.8px;border-radius:4px;border-top:1px #dcd8cf solid;border-left:1px #cdc7ba solid;background:rgb(198,192,180);background:linear-gradient(0deg, rgba(198,192,180,1) 2%, rgba(237,235,231,1) 2%, rgba(255,255,255,1) 63%);margin-bottom:20px;font-size:118%;}
.kizuna_navi li{text-align:center;width:100%;border-right:1px #d8d3c7 solid;}
.kizuna_navi li a{display:block;padding-top:20px;padding-bottom:20px;text-decoration:none;color:#555;font-weight: bold;}
.kizuna_navi li a:hover{background:#FFF;}
.kizuna_navi .select a{color:#333;background:#FFF url("../images/icon/arrow_down.png") center bottom no-repeat;}

@media screen and (max-width: 650px) {
	.kizuna_navi li a{font-size:0.8rem;line-height:130%;}
	.kizuna_navi li span{display:block;}
}

.kizuna_box{border-radius:10px;margin-bottom:20px;}
.kizuna_box div{padding:20px;}

.athlete_border{border:1px #debc00 solid;}
.ambassador_border{border:1px #00be43 dashed;}

.athlete{display:flex;justify-content:space-between;margin-bottom:15px;}
.athlete dt{width:40%;}
.athlete dd{width:56%;}
.athlete dt img{width:100%;border-radius:5px;}

.kizuna_link{display:flex;justify-content:space-between;}
.kizuna_link li{width:100%;}
.kizuna_link li a{display:block;padding:8px 5px;border-radius:3px;text-decoration:none;font-size:1.0rem;margin:1px;}
.insta_button a{background:rgb(253,181,78);background:linear-gradient(320deg, rgba(253,181,78,1) 1%, rgba(173,51,141,1) 50%, rgba(81,94,208,1) 100%);color:#FFF;}
.insta_button a:hover{background:#e30000;}
.twitter_button a{background:#1da1f2;color:#FFF;}
.twitter_button a:hover{background:#e30000;}
.blog_button a{background:#01a54a;color:#FFF;}
.blog_button a:hover{background:#e30000;}
.kizuna_button a{background:#000;color:#FFF;}
.kizuna_button span{background:url("../kizuna/images/kizuna_icon.png") no-repeat left center;padding-left:30px;}
.kizuna_button a:hover{background:#e30000;}
.none_sns_button a{background:#EEE;color:#666;}

@media screen and (min-width: 651px){
	.kizuna_button{display:none;}
}

.kizuna_plans{margin-top:10px;}
.kizuna_plans .title{font-size:1.1rem;border-bottom:1px #8a6b00 dashed;padding-bottom:5px;margin-bottom:7px;}
.kizuna_plans li{width:100%;color:#8a6b00;}
.kizuna_plans li a{display:block;padding:2px 10px;font-size:1.0rem;color:#8a6b00;text-decoration:none;}
.kizuna_plans li a:hover{background:#8a6b00;color:#FFF;border-radius:5px;}

.ambassador{display:flex;justify-content:space-between;flex-wrap:wrap;}
.ambassador li{width:9.5%;margin-bottom:10px;}
.ambassador li img{width:100%;border-radius:20px;}
.ambassador li p{margin-top:5px;text-align:center;color:#d62266;font-size:1.0rem;}
.ambassador_bg{background:url("../kizuna/images/ambassador_bg.jpg")no-repeat left bottom;background-size:cover;padding-top:50px;padding-bottom:50px;}

@media screen and (max-width: 750px){
	.w_kizuna div{padding:8% 5%;}
	.w_kizuna ul li{width:49%;margin-bottom:10px;}
	.kizuna_plans li a{font-size:0.85rem;}
	.ambassador li{width:24.5%;margin-bottom:10px;}
	.ambassador li img{border-radius:5px;}
	.ambassador li p{font-size:0.9rem;}
}
