@charset "utf-8";
/* CSS Document */

.cbox {
    zoom:1;/*for IE 5.5-7*/
}
.cbox:after{/*for modern browser*/
    content:".";
    display: block;
    height:0px;
	line-height: 0;
    clear:both;
    visibility:hidden;
}
.spHeader,
.spNav,
#footBox {
	display: none;
}

/** レスポンシブ **/
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}
@media screen and (max-width: 768px) {
	img {
		max-width: 100%;
		height: auto;
	}
	.site,
	#wholeHeaderPane,
	#res_header,
	#res_headbody.typeA #res_headbodyL,
	#res_header #res_globalnavigation,
	#res_header #res_globalnavigation ul#res_gnavi,
	#res_header #res_headbody,
	#str_container,
	#str_container #str_menuAndContents,
	#res_footer,
	#res_footer #res_footer_utilitylinks,
	#res_footer #res_footer_addressmarks {
		width: 100%;
		margin: 0;
	}
	#res_header #res_globalnavigation,
	.vi_header_04,
	#localMenu,
	#res_headbody,
	#res_seofooter,
	#res_footer_utilitylinks,
	ul#localGuide,
	.moveTop {
		display: none;
	}
	#res_headbody.typeA #res_headbodyL {
		padding: 10px;
	}
	#str_container {
		padding-bottom: 20px;
	}
	.spHeader,
	.spNav,
	#footBox {
		display: block;
	}
	.spHeader:after {
		content: "\00a0";
		background-image: -moz-linear-gradient(top, #4db3f5, #1c8fdd 50%, #2083c8 50%, #2083c8);
		background-image: -webkit-gradient(linear, left top, left bottom, from(#4db3f5), color-stop(0.5, #1c8fdd), color-stop(0.5, #2083c8), to(#2083c8));
		height: 12px;
		display: block;
		width: 100%;
		top: 0;
	}
	.spHeader #header-top {
		background-color: #ffffff;
		border: none;
		display: block;
		position: relative;
		padding: 1.8%;
	}
	.spHeader #header-top h1 {
		font-size: 1px;
	}
	.spHeader #header-top a:first-child {
		display: block;
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0.25);
		float: left;
		width: 26.3%;
		margin: 2px 0 0;
	}
	.spHeader #header-top a:first-child img {
		width: 100%;
		height: auto;
	}
	.spHeader #header-top #menuBtn {
		float: right;
		width: 14.5%;
		height: auto;
	}
	.spHeader #menuArea {
		border: solid 2px #3695d6;
		border-top: solid 10px #3695d6;
		border-bottom: solid 2px #3695d6;
		position: relative;
		margin: 0 10px 20px 10px;
		display: none;
		font-size: 28px !important;
		font-family: 'ヒラギノ角ゴ ProN W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	}
	.spHeader #menuArea ul {
		border-bottom: solid 1px #3695d6;
	}
	.spHeader #menuArea li {
		width: 50%;
		float: left;
		position: relative;
		border-bottom: solid 1px #3695d6;
		border-right: solid 1px #3695d6;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
	}
	.spHeader #menuArea li.last {
		border-bottom: none;
	}
	.spHeader #menuArea li a, header #menuArea li a:visited {
		color: #3695d6;
		font-weight: bold;
	}
	.spHeader #menuArea li a:before {
		content: "\00a0";
		background-image: url(//www.golfdigest.co.jp/resource/sp/img/common/sprites.png);
		width: 32px;
		height: 32px;
		display: block;
		overflow: hidden;
		background-position: -128px -32px;
		position: absolute;
		right: 20px;
		top: 30px;
	}
	.spHeader #menuArea li a div {
		width: 100%;
		padding: 27px 0 !important;
		text-indent: 25px;
		display: inline-block;
		vertical-align: bottom;
	}
	.spHeader #menuArea .show {
		padding: 20px 0;
		text-align: center;
	}
	.spHeader #menuArea .close {
		width: 100%;
		background: #f5fafd url(//www.golfdigest.co.jp/resource/sp/img/top/top_bg_close.gif) top repeat-x;
		text-align: center;
	}
	.spHeader #menuArea .close img {
		width: 40%;
		height: auto;
	}
	.menu {
		overflow: hidden;
		border-top: 1px solid #ababab;
		border-bottom: 1px solid #ababab;
	}
	.menu ul li {
		list-style: none;
		float: left;
		background: linear-gradient(to bottom, #f7f7f7, #dedcdd);
		width: 20%;
		height: auto;
		box-sizing: border-box;
		background-size: cover;
	}
	.menu ul li a {
		height: auto;
		display: block;

		border-left: 1px solid #ababab;
	}
	.menu ul li a img {
		width: 100%;
		height: auto;
		text-align: center;
		vertical-align: bottom;
	}
	#breadcrumbList,
	#topicPath {
		display: none;
	}
	.res_seofooter_top,
	.site-footer {
		display: none;
	}
	#footBox nav.subNavFooter:before {
		content: "\00a0";
		background-image: -moz-linear-gradient(left bottom, #4eb8f4, #4eb8f4 50%, #308ad2 50%, #308ad2),-moz-linear-gradient(left bottom, #4eb8f4, #4eb8f4 50%, #308ad2 50%, #308ad2);
		background-image: -webkit-gradient(linear, left bottom, right top, from(#4eb8f4), color-stop(0.5, #4eb8f4), color-stop(0.5, #308ad2), to(#308ad2)),-webkit-gradient(linear, left bottom, right top, from(#4eb8f4), color-stop(0.5, #4eb8f4), color-stop(0.5, #308ad2), to(#308ad2));
		background-size: 14px 14px, 100% 14px;
		background-repeat: no-repeat, no-repeat;
		background-position: 50% top, left top;
		width: 100%;
		height: 10px;
		position: absolute;
		left: 0;
		top: 0;
	}
	#footBox nav.subNavFooter {
		clear: both;
		margin-top: 0px;
		padding: 0 0 20px 0;
		background: #fff;
		color: #000;
		text-align: center;
		position: relative;
	}
	#footBox .content {
		border-width: 0;
		clear: both;
		overflow: hidden;
		padding: 10px 0 !important;
		position: relative;
	}
	#footBox .fstart {
		padding: 0 10px 20px 10px !important;
	}
	#footBox #menu {
		margin: 10px 0 20px;
	}
	#footBox #menu li {
		width: 50%;
		float: left;
		display: table-cell;
		margin: 0;
		-webkit-box-sizing: border-box;
		vertical-align: middle;
		border: 0;
		border-bottom: 1px #c2c2c2 solid;
		background-color: #f6f6f6;
		color: #333;
		-webkit-box-shadow: rgba(0, 0, 0, 0.60) 0 2px 2px;
	}
	#footBox #menu li a {
		color: #333;
		position: relative;
		display: block;
	}
	#footBox #menu li a:before {
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 10px;
		width: 8px;
		height: 8px;
		margin-top: -4px;
		background: #3695d6;
  	}
	#footBox #menu li a:after{
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 14px;
		width: 8px;
		height: 8px;
		margin-top: -4px;
		background: #f6f6f6;
	}
	#footBox #menu li a:hover {
		text-decoration: none;
	}
	#footBox #menu>li:first-child {
		-webkit-border-top-left-radius: 8px;
	}
	#footBox #menu>li:nth-child(2) {
		-webkit-border-top-right-radius: 8px;
	}
	#footBox #menu>li:nth-last-child(2) {
		-webkit-border-bottom-left-radius: 8px;
		border-bottom: 0;
	}
	#footBox #menu>li:last-child {
		-webkit-border-bottom-right-radius: 8px;
		border-bottom: 0;
	}
	#footBox #menu>li:nth-child(odd) {
		border-right: 1px #c2c2c2 solid;
	}
	#footBox ul.two-columns-list>li>a>div {
		height: 44px;
		padding-top: 0!important;
		padding-bottom: 0!important;
	}
	#footBox ul.basic-linked-list>li>a>div:first-child {
		display: table-cell;
		vertical-align: middle;
		padding: 10px 21px 10px 5px;
	}
	#footBox #menu>li>a>div:before {
		content: "\00a0";
		display: inline-block;
		vertical-align: middle;
		width: 13px;
		height: 13px;
		background-size: contain;
		background-position: center center;
		background-repeat: no-repeat;
	}
	#footBox nav.subNavFooter ul.links-list {
		text-align: left !important;
		margin: 0 !important;
		display: block;
	}
	#footBox nav.subNavFooter li {
		font-size: 20px !important;
		border-bottom: solid 1px #cccccc;
		position: relative;
		padding: 0;
	}
	#footBox nav.subNavFooter ul.links-list li a {
		color: #3399cc !important;
	}
	#footBox nav.subNavFooter li a div {
		width: 100%;
		padding: 27px 0 !important;
		text-indent: 25px;
		display: inline-block;
		vertical-align: bottom;
	}
	#footBox nav.subNavFooter li a:before {
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 22px;
		width: 16px;
		height: 16px;
		margin-top: -8px;
		background: #3695d6;
  	}
	#footBox nav.subNavFooter li a:after{
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 28px;
		width: 16px;
		height: 16px;
		margin-top: -8px;
		background: #fff;
	}
	#footBox nav.pagetop {
		padding: 0 10px 40px 10px !important;
	}
	#footBox .basic-button {
		cursor: pointer;
		text-decoration: none;
		-webkit-border-radius: 8px;
		text-align: center;
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0.25);
		display: inline-block;
		font-size: 24px;
		padding: 0 16px;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(0.5, #fff), color-stop(0.5, #dadada), to(#dadada));
		color: #010101;
		border: 1px solid #232222;
		line-height: 88px;
		height: 88px;
	}
	#footBox .home-page-button {
		font-size: 20px;
		float: left;
		font-weight: normal;
	}
	#footBox .page-top-button {
		float: right;
		font-size: 20px;
		font-weight: normal;
	}
	#footBox .basic-button.narrow {
		height: auto !important;
		line-height: normal;
		padding: 10px;
	}
	#res_footer {
		background: none;
	}
	#res_footer_addressmarks {
		display: block;
		clear: both;
		padding: 30px 0 20px;
		background: #fff;
		color: #000;
		text-align: center;
		font-size: 12px;
		position: relative;
	}
	#res_footer_addressmarks:before {
		content: "\00a0";
		background-image: -moz-linear-gradient(left bottom, #4eb8f4, #4eb8f4 50%, #308ad2 50%, #308ad2),-moz-linear-gradient(left bottom, #4eb8f4, #4eb8f4 50%, #308ad2 50%, #308ad2);
		background-image: -webkit-gradient(linear, left bottom, right top, from(#4eb8f4), color-stop(0.5, #4eb8f4), color-stop(0.5, #308ad2), to(#308ad2)),-webkit-gradient(linear, left bottom, right top, from(#4eb8f4), color-stop(0.5, #4eb8f4), color-stop(0.5, #308ad2), to(#308ad2));
		background-size: 14px 14px, 100% 14px;
		background-repeat: no-repeat, no-repeat;
		background-position: 50% top, left top;
		width: 100%;
		height: 10px;
		position: absolute;
		left: 0;
		top: 0;
	}
	#res_footer_addressmarks address {
		color: #000;
		float: none;
		width: auto;
		background: none;
	}
}
@media screen and (max-width: 550px) {
	.spHeader:after {
		height: 9px;
	}
	.spHeader #menuArea {
		border: solid 1px #3695d6;
		border-top: solid 8px #3695d6;
		border-bottom: solid 2px #3695d6;
		margin: 0 8px 20px 8px;
		font-size: 23px !important;
	}
	.spHeader #menuArea li a:before {
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 25px;
		width: 10px;
		height: 10px;
		margin-top: -5px;
		background: #3695d6;
  	}
	.spHeader #menuArea li a:after{
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 50%;
		right: 30px;
		width: 10px;
		height: 10px;
		margin-top: -5px;
		background: #fff;
	}	
	.spHeader #menuArea li a div {
		padding: 21px 0 !important;
		text-indent: 20px;
	}
	.spHeader #menuArea .show {
		padding: 18px 0;
	}
	.site-footer ul {
		display: none;
	}
	#footBox nav.subNavFooter {
		padding-bottom: 20px;
	}
	#footBox nav.subNavFooter:before,
	#res_footer_addressmarks:before {
		height: 6px;
	}
	#footBox nav.subNavFooter li {
		font-size: 18px !important;
	}
	#footBox nav.subNavFooter li a div {
		padding: 20px 0 !important;
		text-indent: 20px;
	}
	#footBox nav.subNavFooter li a:before {
		right: 24px;
		width: 12px;
		height: 12px;
		margin-top: -6px;
  	}
	#footBox nav.subNavFooter li a:after{
		right: 30px;
		width: 12px;
		height: 12px;
		margin-top: -6px;
	}
	#footBox nav.pagetop {
		padding-bottom: 30px !important;
	}
	#footBox .home-page-button,
	#footBox .page-top-button {
		font-size: 16px;
	}
}

@media screen and (max-width: 480px) {
	.spHeader:after {
		height: 8px;
	}
	.spHeader #menuArea {
		border: solid 1px #3695d6;
		border-top: solid 7px #3695d6;
		border-bottom: solid 2px #3695d6;
		margin: 0 8px 20px 8px;
		font-size: 20px !important;
	}
	.spHeader #menuArea li a div {
		padding: 17px 0 !important;
		text-indent: 18px;
	}
	#breadcrumbList {
		display: none;
	}
	.site-footer {
		padding: 15px 0 15px;
	}
	.site-info {
		font-size: 9px;
		padding: 0;
		text-align: center;
		color: #666;
	}
	#footBox .content {
		padding: 6px 0 10px !important;
	}
	#footBox .fstart {
		padding: 0 10px 20px 10px !important;
	}
	#footBox nav.subNavFooter {
		padding-bottom: 10px;
	}
	#footBox nav.subNavFooter:before,
	#res_footer_addressmarks:before {
		height: 6px;
	}
	#footBox nav.subNavFooter li {
		font-size: 14px !important;
	}
	#footBox nav.subNavFooter li a div {
		padding: 12px 0 !important;
		text-indent: 12px;
	}
	#footBox nav.subNavFooter li a:before {
		right: 16px;
		width: 10px;
		height: 10px;
		margin-top: -5px;
  	}
	#footBox nav.subNavFooter li a:after{
		right: 20px;
		width: 10px;
		height: 10px;
		margin-top: -5px;
	}
	#footBox nav.pagetop {
		padding-bottom: 20px !important;
	}
	#footBox .basic-button.narrow {
		padding: 5px;
	}
	#footBox .home-page-button,
	#footBox .page-top-button {
		font-size: 12px;
	}
	#res_footer_addressmarks {
		padding: 20px 0 10px;
	}
	#res_footer_addressmarks address {
		font-size: 9px;
	}
}
@media screen and (max-width: 320px) {
	.spHeader:after {
		height: 6px;
	}
	.spHeader #menuArea {
		border: solid 1px #3695d6;
		border-top: solid 4px #3695d6;
		border-bottom: solid 1px #3695d6;
		margin: 0 5px 10px 5px;
		font-size: 13px !important;
	}
	.spHeader #menuArea li a div {
		padding: 11px 0 !important;
		text-indent: 10px;
	}
	.spHeader #menuArea li a:before {
		right: 16px;
		width: 8px;
		height: 8px;
		margin-top: -5px;
  	}
	.spHeader #menuArea li a:after{
		right: 20px;
		width: 8px;
		height: 8px;
		margin-top: -5px;
	}
	.spHeader #menuArea .show {
		padding: 10px 0;
	}

}