/* ---------------------------------------------------------------
start COMMON CSS
--------------------------------------------------------------- */

/* noto-sans-jp-light - japanese */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/NotoSansJP-Light.woff2');
  src: local(''),
       url('../fonts/NotoSansJP-Light.woff2') format('woff2'),
       url('../fonts/NotoSansJP-Light.woff') format('woff'),
}
/* noto-sans-jp-regular - japanese */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/noto-sans-jp-v28-japanese-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-jp-v28-japanese-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-jp-v28-japanese-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-jp-v28-japanese-regular.svg#NotoSansJP') format('svg'); /* Legacy iOS */
}
/* noto-sans-jp-500 - japanese */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/noto-sans-jp-v28-japanese-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-jp-v28-japanese-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-jp-v28-japanese-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-jp-v28-japanese-500.svg#NotoSansJP') format('svg'); /* Legacy iOS */
}
/* noto-sans-jp-700 - japanese */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/noto-sans-jp-v28-japanese-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-jp-v28-japanese-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-jp-v28-japanese-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-jp-v28-japanese-700.svg#NotoSansJP') format('svg'); /* Legacy iOS */
}
/* noto-sans-jp-900 - japanese */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/noto-sans-jp-v28-japanese-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-jp-v28-japanese-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-jp-v28-japanese-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-jp-v28-japanese-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/noto-sans-jp-v28-japanese-900.svg#NotoSansJP') format('svg'); /* Legacy iOS */
}

* {
	-webkit-box-sizing : border-box ;
	-moz-box-sizing : border-box ;
	box-sizing : border-box ;
}

body {
	width: 100%;
	margin: 0;
	padding: 0;
	color: #000;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 15px;
	line-height: 1.85;
	font-weight: 400;
	-webkit-text-size-adjust: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	z-index: 0;
	opacity: 0;
	transition: opacity .1s;
}

body.font-load {
	opacity: 1;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

a {
	outline: none;
	color: #0096b0;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
	cursor: pointer;
}

button {
	outline: none;
}

img {
	vertical-align: bottom;
}

p {
	margin: 0 0 15px 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0px;
}

.aligncenter {
	text-align: center;
}

.alignright {
	text-align: right;
}

.alignjust {
	text-align: justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph;
}

.w100{
	width: 100%;
}

.fleft {
	float: left;
}

.fright {
	float: right;
}

.note {
	font-size: .7em;
}

.red {
	color: #e60012;
}

.under {
	text-decoration: underline;
}

.iblock {
	display: inline-block;
}

.indent1 {
	padding-left: 1em;
	text-indent: -1em;
}

.indent1 * {
	text-indent: 0;
}

.grad1 {
	background: rgb(0,98,170); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0,98,170,1) 0%, rgba(22,152,134,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0062aa', endColorstr='#169886',GradientType=1 ); /* IE6-9 */
}



/* --------------- header --------------- */

#header {
	width: 100%;
	height: 74px;
	margin: 0;
	padding: 0;
	background: rgb(0,98,170); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0,98,170,1) 0%, rgba(34,181,115,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0,98,170,1) 0%,rgba(34,181,115,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0,98,170,1) 0%,rgba(34,181,115,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0062aa', endColorstr='#22b573',GradientType=1 ); /* IE6-9 */
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99;
}

#header::before {
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.22);
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}

.inner_header {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	display: flex;
	align-items: center;
	position: relative;
	z-index: 10;
}

.logo_header {
	width: 330px;
	height: 200px;
	margin: 0;
	padding: 35px 0 0 50px;
	position: absolute;
	top: 0;
	left: 0;
}

.logo_header::after {
	content: "";
	width: 288px;
	height: 288px;
	background-color: #fff;
	box-shadow: 1px 1px 12px -7px #000;
	transform: rotate(45deg);
	transform-origin: 100% 0;
	display: block;
	position: absolute;
	top: 0;
	left: 45px;
	z-index: -1;
}

.logo_header a {
	width: 158px;
	display: block;
	transition: .2s;
}

.nav_header {
	width: 100%;
	margin: 0;
	padding: 0 25px 0 310px;
	display: flex;
	justify-content: flex-end;
}

.nav_header > ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
}

.nav_header > ul > li {
	margin: 0;
	padding: 0 18px 8px;
	line-height: 1.3;
	position: relative;
	z-index: 0;
}

.nav_header > ul > li > a {
	margin: 0;
	padding: 0;
	color: #fff;
	font-weight: 400;
	text-align: center;
	text-decoration: none;
	position: relative;
	z-index: 0;
}

.nav_header > ul > li > a::before,
.nav_header > ul > li > a::after {
	content: "";
	width: 11px;
	height: 2px;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 10px;
	position: absolute;
	bottom: -7px;
	opacity: 0;
	transition: .15s;
}

.nav_header > ul > li > a::before {
	left: 0;
	right: 8px;
	transform-origin: bottom left;
	transform: rotate(35deg);
}

.nav_header > ul > li > a::after {
	left: 8px;
	right: 0;
	transform-origin: bottom right;
	transform: rotate(-35deg);
}

.submenu {
	width: 200px;
	margin: 0;
	padding: 30px 0 0 0;
	position: absolute;
	top: 20px;
	left: calc(50% - 100px);
	visibility: hidden;
	opacity: 0;
}

	.submenu {
		transition: all .2s ease-in-out 0s;
	}

	.submenu .inner:hover:after {
		border-color: transparent transparent #ecfcff transparent;
	}

	.submenu .inner a:hover {
		background-color: #d5e9ff;
	}

.nav_header ul li:hover .submenu {
	visibility: visible;
	opacity: 1;
}

.submenu .inner {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	background-color: #fff;
	border: solid 2px #003067;
	position: relative;
	z-index: 0;
	box-shadow: 3px 3px 6px -2px #131313;
}

.submenu .inner a {
	margin: 0;
	padding: 14px 15px 14px 15px;
	text-align: left;
	line-height: 1.25;
	color: #003067;
	font-weight: 500;
	text-decoration: none;
	border-bottom: dashed 1px #003067;
	position: relative;
	z-index: 0;
	transition: background .2s;
	display: block;
}

.submenu .inner:before {
	content: "";
	width: 0;
	height: 0;
	margin: auto;
	border-style: solid;
	border-width: 0 9px 9px 9px;
	border-color: transparent transparent #003067 transparent;
	position: absolute;
	top: -11px;
	left: 0;
	right: 0;
	transition: all .2s;
}

.submenu .inner:after {
	content: "";
	width: 0;
	height: 0;
	margin: auto;
	border-style: solid;
	border-width: 0 8px 8px 8px;
	border-color: transparent transparent #fff transparent;
	position: absolute;
	top: -8px;
	left: 0;
	right: 0;
	transition: all .2s;
}

.submenu .inner a:after {
	content: "";
	width: 6px;
	height: 6px;
	border-top: solid 2px #003067;
	border-right: solid 2px #003067;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 4px);
	right: 13px;
}

.submenu .inner a:last-of-type {
	border-bottom: none;
}

#menubtn {
	display: none;
}


/* --------------- footer --------------- */

.pagetop {
	width: 92px;
	height: 109px;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	background-image: url(../img/pagetop.png);
	background-repeat: no-repeat;
	background-size: 100% auto;
	position: fixed;
	right: 15px;
	bottom: 15px;
	z-index: 5;
	cursor: pointer;
	display: none;
	transition: transform .3s;
}

#footer {
	margin: 0;
	padding: 60px 0 30px;
	color: #fff;
	background-color: #003067;
}

#footer a {
	color: #fff;
	text-decoration: none;
}

.inner_footer {
	width: 94%;
	max-width: 1150px;
	margin: 0 auto 30px;
	padding: 0;
	display: flex;
}

.inner_footer .left {
	width: 240px;
	margin: 0;
	padding: 0;
}

.logo_footer {
	width: 160px;
	display: block;
	transition: .2s;
}

.inner_footer .right {
	width: calc(100% - 240px);
	margin: 0;
	padding: 0;
}

.nav_footer {
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}

.nav_footer ul {
	min-width: 100px;
	margin: 0 30px 30px 0;
	padding: 0;
	list-style: none;
	flex-shrink: 0;
}

.nav_footer ul:last-of-type {
	margin-right: 0;
}

.nav_footer ul li {
	margin: 0 0 7px;
	padding: 0 0 0 12px;
	font-size: 12px;
	font-weight: 300;
	line-height: 1.45;
	position: relative;
	z-index: 0;
}

.nav_footer ul li:last-of-type {
	margin-bottom: 0;
}

.nav_footer ul li.parent {
	margin-bottom: 11px;
}

.nav_footer ul li.parent::before {
	content: "\003E";
	position: absolute;
	top: 0;
	left: 0;
}

.nav_footer ul li.child::before {
	content: "\30FB";
	position: absolute;
	top: 0;
	left: 0;
}

.wrap_footer_btm {
	width: 94%;
	max-width: 1150px;
	margin: 0 auto;
	padding: 0;
	display: flex;
	align-items: flex-end;
}

.copyright {
	width: 240px;
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: 300;
	line-height: 1.4;
}

.cont_footer_shop {
	width: calc(100% - 240px);
	margin: 0;
	padding: 0 0 0 10px;
	display: flex;
}

.cont_footer_shop dl {
	margin: 0 3.5% 0 0;
	padding: 0;
	font-size: 12px;
	line-height: 1.45;
	font-weight: 300;
	display: flex;
	align-items: flex-start;
}

.cont_footer_shop dl:last-of-type {
	margin-right: 0;
}

.cont_footer_shop dl dt {
	width: 88px;
	margin: 0;
	padding: 0;
}

.cont_footer_shop dl dd {
	width: calc(100% - 88px);
	margin: 0;
	padding: 0 0 0 12px;
}

.cont_footer_shop dl dd strong {
	font-weight: 500;
}


/* --------------- common --------------- */

#wrap {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#wrap.sub {
	padding: 74px 0 0;
	background-color: #f2f2f2;
}

.bg_pagettl {
	width: 100%;
	height: 295px;
	margin: 0;
	padding: 0 0 60px;
	background-size: cover;
	background-position: center center;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.bg_pagettl .pagettl {
	margin: 0;
	padding: 0;
}

.bg_pagettl .pagettl .en {
	margin: 0 auto 8px;
	padding: 0;
}

.bg_pagettl .pagettl .jp {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
}

#subcontent {
	width: 94%;
	max-width: 1000px;
	margin: 0 auto 60px;
	padding: 0;
	position: relative;
	top: -60px;
	z-index: 0;
}

.col_subcontent {
	margin: 0 auto;
	padding: 15px 20px;
	background-color: #fff;
	box-sizing: border-box;
}

.breadcrumb {
	margin: 0 10px 15px;
	padding: 0;
	font-size: 12px;
}









/* ---------------------------------------------------------------
	end common
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 1200px
--------------------------------------------------------------- */

@media screen and ( max-width: 1200px ) {

/* --------------- footer --------------- */

	.inner_footer .left {
		width: 200px;
	}

	.inner_footer .right {
		width: calc(100% - 200px);
	}

	.nav_footer ul {
		margin-right: 15px;
	}

	.copyright {
		width: 140px;
	}

	.cont_footer_shop {
		width: calc(100% - 140px);
	}

}

/* ---------------------------------------------------------------
	end max 1200px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 1100px
--------------------------------------------------------------- */

@media screen and ( max-width: 1100px ) {

/* --------------- header --------------- */

	.nav_header {
		padding-right: 5px;
	}

}

/* ---------------------------------------------------------------
	end max 1100px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start min 1034px
--------------------------------------------------------------- */

@media screen and ( min-width: 1034px ) {

	.pc_none {
		display: none;
	}


}

/* ---------------------------------------------------------------
	end min 1034px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 1033px
--------------------------------------------------------------- */

@media screen and ( max-width: 1033px ) {

/* --------------- header --------------- */

	.logo_header {
		width: 300px;
		height: 190px;
		padding: 20px 0 0 35px;
	}

	.logo_header::after {
		content: "";
		width: 265px;
		height: 265px;
		left: 35px;
	}

	.nav_header {
		width: 100%;
		max-width: 350px;
		height: calc(100vh - 74px);
		margin: 0;
		padding: 30px 20px 10vh;
		background: rgb(0,98,170); /* Old browsers */
		background: -moz-linear-gradient(left, rgba(0,98,170,1) 0%, rgba(22,152,134,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0062aa', endColorstr='#169886',GradientType=1 ); /* IE6-9 */
		border-right: none;
		display: none;
		position: absolute;
		top: 74px;
		right: 0;
		overflow: auto;
	}

	.nav_header > ul {
		margin: 0 0 30px;
		display: block;
	}

	.nav_header > ul > li {
		padding: 0;
		border-bottom: solid 1px #fff;
	}

	.nav_header > ul > li:first-of-type {
		border-top: solid 1px #fff;
	}

	.nav_header > ul > li > a {
		width: 100%;
		padding: 13px 20px 13px 30px;
		color: #fff;
		font-size: 15px;
		text-align: left;
		display: block;
		position: relative;
		z-index: 0;
	}

	.nav_header > ul > li > a::before {
		content: "";
		width: 0;
		height: 0;
		margin: auto 0;
		border-style: solid;
		border-width: 5px 0 5px 8px;
		border-color: transparent transparent transparent #fff;
		border-radius: 0px;
		position: absolute;
		top: 18px;
		bottom: auto;
		left: 14px;
		right: auto;
		transform: none;
		background-color: transparent;
		opacity: 1;
	}

	.submenu {
		width: auto;
		padding: 0;
		position: static;
		visibility: visible;
		opacity: 1;
	}

	.submenu .inner {
		background-color: transparent;
		border: none;
		box-shadow: none;
	}

	.submenu .inner:before,
	.submenu .inner:after {
		content: none;
	}

	.submenu .inner a {
		padding: 14px 15px 14px 30px;
		color: #fff;
		border-bottom: dashed 1px #fff;
	}

	.submenu .inner a:first-of-type {
		border-top: dashed 1px #fff;
	}

	.submenu .inner a:after {
		content: none;
	}

	#menubtn {
		width: 74px;
		height: 74px;
		margin: 0 0 0 auto;
		padding: 0;
		transition: .4s;
		display: block;
		position: relative;
		z-index: 2;
	}

	#menubtn.active {
		background: rgb(0,98,170); /* Old browsers */
		background: -moz-linear-gradient(left, rgba(0,98,170,1) 0%, rgba(22,152,134,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(0,98,170,1) 0%,rgba(22,152,134,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0062aa', endColorstr='#169886',GradientType=1 ); /* IE6-9 */
	}

	#menubtn .btn {
		width: 38px;
		height: 100%;
		margin: 0 auto;
		position: relative;
		z-index: 0;
	}

	#menubtn .btn span {
		width: 100%;
		height: 3px;
		margin: auto;
		padding: 0;
		background-color: #fff;
		display: inline-block;
		transition: all .4s;
		-moz-transition: all .4s;
		-webkit-transition: all .4s;
		position: absolute;
		left: 0;
		right: 0;
	}

	#menubtn span:nth-child(1) {
		top: 22px;
	}

	#menubtn span:nth-child(2) {
		top: 37px;
	}

	#menubtn span:nth-child(3) {
		top: 52px;
	}

	#menubtn.active span:nth-of-type(1) {
		width: 96%;
		-webkit-transform: translateY(20px) rotate(-45deg);
		transform: translateY(20px) rotate(-45deg);
		top: 17px;
	}

	#menubtn.active span:nth-of-type(2) {
		opacity: 0;
	}

	#menubtn.active span:nth-of-type(3) {
		width: 96%;
		-webkit-transform: translateY(-20px) rotate(45deg);
		transform: translateY(-20px) rotate(45deg);
		top: 57px;
	}

	#overlay {
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0);
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 10;
		transition: all .4s;
		visibility: hidden;
	}

	.open #overlay {
		background: rgba(0,0,0,0.6);
		visibility: visible;
	}


	/* --------------- footer --------------- */

	.nav_footer ul {
		min-width: 115px;
		margin-right: 25px;
	}

	.cont_footer_shop dl {
		margin-right: 7%;
		display: block;
	}

	.cont_footer_shop dl dt {
		margin-bottom: 10px;
	}

	.cont_footer_shop dl dd {
		width: auto;
		padding: 0;
	}


}

/* ---------------------------------------------------------------
	end max 1033px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start 701px�`1033px
--------------------------------------------------------------- */

@media print,screen and ( min-width: 701px ) and ( max-width: 1033px ) {

	.tab_none2 {
		display: none;
	}



}

/* ---------------------------------------------------------------
	end 701px�`1033px
--------------------------------------------------------------- */
/* ---------------------------------------------------------------
	start max 850px
--------------------------------------------------------------- */

@media screen and ( max-width: 850px ) {

	/* --------------- header --------------- */

	.logo_header {
		width: 270px;
		height: 175px;
		padding: 15px 0 0 25px;
	}

	.logo_header::after {
		width: 240px;
		height: 240px;
		left: 25px;
	}

	/* --------------- footer --------------- */

	.pagetop {
		width: 86px;
		height: 102px;
	}

	.cont_footer_shop dl {
		margin-right: 5%;
	}



}

/* ---------------------------------------------------------------
	end max 850px
--------------------------------------------------------------- */
/* ---------------------------------------------------------------
	start min 701px
--------------------------------------------------------------- */

@media print,screen and ( min-width: 701px ) {

	.tab_none {
		display: none;
	}

	img {
		image-rendering: -webkit-optimize-contrast;
	}


	/* --------------- header --------------- */

	.logo_header a:hover {
		opacity: 0.75;
	}

	.nav_header ul li a:hover::before,
	.nav_header ul li a:hover::after {
		opacity: 1;
	}

	/* --------------- footer --------------- */

	.pagetop:hover {
		transform: translateY(-10px);
	}

	#footer a:hover {
		text-decoration: underline;
	}

	.logo_footer:hover {
		opacity: 0.75;
	}


}

/* ---------------------------------------------------------------
	end min 701px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 700px
--------------------------------------------------------------- */

@media screen and ( max-width: 700px ) {

	.sp_none {
		display: none;
	}

	.bg_pagettl {
		height: 180px;
		padding: 0;
	}
	
	#wrap.sub {
		padding: 64px 0 0;
	}

	#subcontent {
		width: 100%;
		margin: 0;
		position: static;
	}

	.col_subcontent {
		padding: 20px;
	}

	.breadcrumb { display: none; }


	/* --------------- header --------------- */

	#header {
		height: 64px;
	}

	.logo_header {
		width: 215px;
		height: 145px;
		padding: 10px 0 0 15px;
	}

	.logo_header::after {
		width: 205px;
		height: 205px;
		top: -20px;
		left: 18px;
	}

	.logo_header a {
		width: 130px;
	}

	.nav_header {
		max-width: 260px;
		height: calc(100vh - 64px);
		top: 64px;
	}

	#menubtn {
		width: 64px;
		height: 64px;
	}

	#menubtn span:nth-child(1) {
		top: 17px;
	}

	#menubtn span:nth-child(2) {
		top: 31px;
	}

	#menubtn span:nth-child(3) {
		top: 45px;
	}

	#menubtn.active span:nth-of-type(1) {
		top: 10px;
	}

	#menubtn.active span:nth-of-type(3) {
		top: 50px;
	}



	/* --------------- footer --------------- */

	.pagetop {
		width: 74px;
		height: 88px;
	}

	#footer {
		padding: 50px 0 20px;
	}

	.inner_footer {
		width: 90%;
		margin-bottom: 18px;
	}

	.inner_footer .left {
		margin: 0 auto;
	}

	.inner_footer .right,
	.cont_footer_shop {
		display: none;
	}

	.wrap_footer_btm {
		width: 90%;
	}

	.copyright {
		width: 100%;
		text-align: center;
	}


}
/* ---------------------------------------------------------------
	end max 700px
--------------------------------------------------------------- */

/* ---------------------------------------------------------------
	start max 450px
--------------------------------------------------------------- */

@media screen and ( max-width: 450px ) {

	.bg_pagettl {
		height: 30vw;
	}






}

/* ---------------------------------------------------------------
	end max 450px
--------------------------------------------------------------- */