@charset "utf-8";

/*NASサイト 第二下層ページ（右カラムなし）レスポンシブ設定*/
/* ※headerは総合トップオリジナル、 ※footerは第二階層以下と共通 */

/* ================================================================= */

#container {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding-bottom: 0px;
}

/* #container img{
	max-width: 100%;
	height: auto;
} */

#content {
	width: 100%;
    max-width: 960px;
}

#topicPath{
	width: 100%;
  max-width: 960px;
}

#logoContainer .logoBox #hamMenu{
	display: none;
}

#header .list_menu {
	display: none;
}

.js-menu,.js-search{
	display: none;
}

.sp_footer {
	display: none;
}

/* ================================================================= */

@media (max-width: 767px) {
	
	#container {
		padding-bottom: 0px;
	}

	#container img{
	max-width: 100%;
	height: auto;
}
		
	#header {
		width: 100%;
		height: 0px;
		padding: 0;
		margin: 0;
		box-sizing: border-box;
		position: relative;
		background: #fff;
		z-index: 9999;
	}

	#header #logoContainer {
		width: 100%;
	}
	#header	#logoContainer .logoBox #logo {
			width: 100px;
			height: auto;
			margin: 15px 0 15px 15px;
		}
	#header	#logoContainer .logoBox #logo img {
			width: 100%;
			height: auto;
			display: block;
		}

	#header .hamburger {
		width: 36px;
		height: 21px;
		position: absolute;
		top: 50%;
		right: 10px;
		margin-top: -10px;
		display: block;
		cursor: pointer !important;
	}
	#header .hamburger:before {
		content: '';
		display: block;
		width: 100%;
		height: 12px;
		border-top: 3px solid #0a5aaa;
		border-bottom: 3px solid #0a5aaa;
		box-sizing: border-box;
		position: absolute;
		top: 0;
		left: 0;
		transition: all .2s ease 0s;
	}
	#header .hamburger:after {
		content: '';
		display: block;
		width: 100%;
		border-top: 3px solid #0a5aaa;
		position: absolute;
		bottom: 0;
		left: 0;
		transition: all .2s ease 0s;
	}

	#header .list_menu {
		display: block;
		width: 100%;
		height: 0;
		float: none;
		margin: 0;
		box-sizing: border-box;
		background: rgba(10, 90, 170, 0.8);
		overflow: auto;
		transition: all .2s ease 0s;
	}
	#header .list_menu li {
		display: block;
		padding: 15px 0 15px 15px;
		margin: 0;
		font-size: 14px;
        font-weight: bold;
	}
	#header .list_menu li a {
		color: #fff;
	}
	#header .list_menu li a:hover {
		color: #fff;
	}
		#header.opened {
			position: fixed;
		}
		#header.opened .list_menu  {
			height: calc(100vh - 62.5px);
		}
		#header.opened .hamburger:before {
			content: '';
			height: auto;
			-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
			border-bottom: none;
			top: 10px;
		}
		#header.opened .hamburger:after {
			-webkit-transform: rotate(-45deg);
					transform: rotate(-45deg);
			bottom: 8px;
		}
		#header.opened .list_menu {
			padding: 15px 0 0;
			height: calc(100vh - 62.5px);
		}
	

	#logoContainer {
		width: 100%;
	}
	
	#logoContainer .logoBox .tagLine,
	#logoContainer .headLinks,
	#gnaviContainer{
		display: none;
	}
	
	#clubLocation{
		display: none;
	}
	
	#topicPath{
		display: none;
	}
	
	#content {
		float: none;
		width: 100%;
		max-width: none;
		/*border-top: solid 1px #ddd;*/
	}
	
	#subNavi {
		display: none;
	}

	.sp_footer { display: block; }
	.sp_footer .pageTop {
		text-align:right;
		padding:0 3% 0 0;
	}
	
	#footer{
		margin-top: 0px;
	}
	
	#footContents{
		padding: 20px 0 10px;
	}
	
	#companyCol .inner{
		width: 100%;
		padding: 0 0 10px;
	}
	
	#footContents .footLinks{
		width: 100%;
	}
	
	#footer .pageTop{
		display: none;
	}
	
	#footContents .footLinks .figureCol01 .imgL{
		float: none;
		width: 100%!important;
		text-align: center;
		margin: 0;
	}
	
	#footContents .footLinks .figureCol01 .txt{
		display: none;
	}
	
	#footContents .footLinks .linkCol ul{
		display: flex;
		flex-flow: row wrap;
		justify-content:flex-start;
		align-items:stretch;

		/*--- IE10 用 ---*/
		display:-ms-flexbox;
		-ms-flex-flow:row wrap;
		-ms-flex-pack:flex-start;
		-ms-flex-align:stretch;

		/*--- Androidブラウザ用 ---*/
		display:-webkit-box;
		-webkit-box-direction:row;
		-webkit-box-pack:flex-start;
		-webkit-box-align:stretch;

		/*--- safari（PC）用 ---*/
		display:-webkit-flex;
		-webkit-flow:row wrap;
		-webkit-justify-content:flex-start;
		-webkit-align-items:stretch;
	}
	
	#footContents .footLinks .linkCol li{
		float: none;
		width: auto;
		margin-right: 2%;
		box-sizing: border-box;
	}
	
	#footContents .footLinks .linkCol li:nth-child(1){
		padding-top: 10px;
		width: 32%;
		text-align: center;
	}
	
	#footContents .footLinks .linkCol li:nth-child(2){
		padding-top: 10px;
		width: 64%;
		
		display: flex;
		flex-flow: row nowrap;
		justify-content:center;
		align-items:stretch;

		/*--- IE10 用 ---*/
		display:-ms-flexbox;
		-ms-flex-flow:row nowrap;
		-ms-flex-pack:center;
		-ms-flex-align:stretch;

		/*--- Androidブラウザ用 ---*/
		display:-webkit-box;
		-webkit-box-direction:row;
		-webkit-box-pack:center;
		-webkit-box-align:stretch;

		/*--- safari（PC）用 ---*/
		display:-webkit-flex;
		-webkit-flow:row nowrap;
		-webkit-justify-content:center;
		-webkit-align-items:stretch;
	}
	
	#footContents .footLinks .linkCol li:nth-child(2) dl{
		width: 48%;
		margin-right: 4%;
		text-align: center;
	}
	
	#footContents .footLinks .linkCol li:nth-child(2) ul{
		width: 48%;
		text-align: center;
	}
	
	#footContents .footLinks .linkCol li:nth-child(2) ul li{
		width: 100%;
		padding: 0;
	}
	
	#footContents .footLinks .linkCol li:nth-child(3){
		width: 48%;
		margin-top: 10px;
		padding-right: 2%;
		text-align: right;
	}
	
	#footContents .footLinks .linkCol li:nth-child(4){
		width: 48%;
		margin-top: 10px;
		padding-left: 2%;
		text-align: left;
	}
	
	#footContents .footLinks .linkCol li:nth-child(5){
		display: none;
	}
	
	#footContents .footLinks .linkCol{
		margin: 0;
		padding: 0 3%;
	}
	
	#footContents .footLinks .linkCol li dl, #footContents .footLinks .linkCol li dl + .child{
		margin: 0;
	}
	
	#footContents .footLinks .linkCol li dl dd{
		display: none;
	}
	
	#companyCol .leftBlock{
		float: none;
		width: 100%;
	}
	
	#companyCol .rightBlock{
		float: none;
		width: 100%;
		padding-top: 10px;
		text-align: center;
	}
	
	#companyCol .leftBlock ul{
		display: flex;
		flex-flow: row wrap;
		justify-content:center;
		align-items:stretch;

		/*--- IE10 用 ---*/
		display:-ms-flexbox;
		-ms-flex-flow:row wrap;
		-ms-flex-pack:center;
		-ms-flex-align:stretch;

		/*--- Androidブラウザ用 ---*/
		display:-webkit-box;
		-webkit-box-direction:row;
		-webkit-box-pack:center;
		-webkit-box-align:stretch;

		/*--- safari（PC）用 ---*/
		display:-webkit-flex;
		-webkit-flow:row wrap;
		-webkit-justify-content:center;
		-webkit-align-items:stretch;
		
		flex-wrap:5;
		
		background: url(../img/bg_line02.png) repeat-x center 40%;
	}
	
	#companyCol .leftBlock ul li{
		float: none;
		width: 20%;
		text-align: center;
		box-sizing: border-box;
		margin: 0 0 10px 0;
		padding: 0 8px;
		border-right: solid 1px #4d4d4f;
		font-size: 72%;
		line-height: 1;
		white-space: nowrap;
	}
	
	#companyCol .leftBlock ul li:nth-child(1),
	#companyCol .leftBlock ul li:nth-child(2){
		width: 18%;
	}
	
	#companyCol .leftBlock ul li:nth-child(4),
	#companyCol .leftBlock ul li:nth-child(5){
		width: 22%;
	}
	
	#companyCol .leftBlock ul li:nth-child(6),
	#companyCol .leftBlock ul li:nth-child(7){
		margin: 18px 0 13px 0;
		width: auto;
		
	}
	
}

/* ================================================================= */
