/*----------
01.蜈ｱ騾�
02.繝倥ャ繝€繝ｼ
03.繝輔ャ繧ｿ繝ｼ縺雁撫縺�粋繧上○
04.繝輔ャ繧ｿ繝ｼ
05.info_area
06.菴ｿ逕ｨ荳翫�豕ｨ諢�
----------*/

/*----------
01.蜈ｱ騾�
----------*/

/* @font-face {
font-family: 'A-OTF-UDShinGoPro-Bold';
src:url('../fonts/A-OTF-UDShinGoPro-Bold.woff2') format('woff2'),
url('../fonts/A-OTF-UDShinGoPro-Bold.woff') format('woff'),
url('../fonts/AA-OTF-UDShinGoPro-Bold.ttf')  format('truetype'); ttf - Safari, Android, iOS
font-weight: normal;
font-style: normal;
}


@font-face {
font-family: 'A-OTF-UDShinGoPro-Medium';
src:url('../fonts/A-OTF-UDShinGoPro-Medium.woff2') format('woff2'),
url('../fonts/A-OTF-UDShinGoPro-Medium.woff') format('woff'),
url('../fonts/A-OTF-UDShinGoPro-Medium.ttf')  format('truetype'); ttf - Safari, Android, iOS
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'A-OTF-UDShinGoPro-Regular';
src:url('../fonts/A-OTF-UDShinGoPro-Regular.woff2') format('woff2'),
url('../fonts/A-OTF-UDShinGoPro-Regular.woff') format('woff'),
url('../fonts/A-OTF-UDShinGoPro-Regular.ttf')  format('truetype'); ttf - Safari, Android, iOS
font-weight: normal;
font-style: normal;
} */
/*
@font-face {
font-family: 'HVD-Fonts-BrandonGrotesque-Black';
src: url('../fonts/HVD-Fonts-BrandonGrotesque-Black.eot');
src:url('../fonts/HVD-Fonts-BrandonGrotesque-Black.eot?#iefix') format('embedded-opentype'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Black.woff2') format('woff2'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Black.woff') format('woff'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Black.ttf')  format('truetype'); ttf - Safari, Android, iOS
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'HVD-Fonts-BrandonGrotesque-Bold';
src: url('../fonts/HVD-Fonts-BrandonGrotesque-Bold.eot');
src:url('../fonts/HVD-Fonts-BrandonGrotesque-Bold.eot?#iefix') format('embedded-opentype'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Bold.woff2') format('woff2'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Bold.woff') format('woff'),
url('../fonts/HVD-Fonts-BrandonGrotesque-Bold.ttf')  format('truetype');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Avenir-Black';
src: url('../fonts/Avenir-Black.eot');
src:url('../fonts/Avenir-Black.eot?#iefix') format('embedded-opentype'),
url('../fonts/Avenir-Black.woff2') format('woff2'),
url('../fonts/Avenir-Black.woff') format('woff'),
url('../fonts/Avenir-Black.ttf')  format('truetype'); ttf - Safari, Android, iOS
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Avenir-Medium';
src: url('../fonts/Avenir-Medium.eot');
src:url('../fonts/Avenir-Medium.eot?#iefix') format('embedded-opentype'),
url('../fonts/Avenir-Medium.woff2') format('woff2'),
url('../fonts/Avenir-Medium.woff') format('woff'),
url('../fonts/Avenir-Medium.ttf')  format('truetype');
font-weight: normal;
font-style: normal;
}

*/



body{
-webkit-font-smoothing: antialiased;
font-family:Helvetica,Arial,Meiryo,'繝｡繧､繝ｪ繧ｪ','繝偵Λ繧ｮ繝手ｧ偵ざ Pro w3','Hiragino Kaku Gothic Pro,osaka','�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
}

#wrapper{
width: 100%;
font-family: sans-serif;
/*font-family: "UD譁ｰ繧ｴ R";*/
font-family:Helvetica,Arial,Meiryo,'繝｡繧､繝ｪ繧ｪ','繝偵Λ繧ｮ繝手ｧ偵ざ Pro w3','Hiragino Kaku Gothic Pro,osaka','�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
font-size: 14px;
overflow: hidden;
}

.pc{
display: block;
}

.sp{
display: none;
}

.contents_in{
max-width: 1020px;
margin: 0 auto;
}

[type=submit] {
	cursor: pointer;
}

[type=submit]:hover {
	opacity: .8;
}



/*----------
02.繝倥ャ繝€繝ｼ
----------*/

header{
/* max-width: 40px; */
width: 100%;
position: fixed;
top: 0;
left: 0;
height: 100vh;

}

header .header_in{
height: 100vh;
position: relative;

}

header.active_fast .header_in{
z-index: 12;
}

header::after{
content: "";
background:#1f2e31;
width: 40px;
height: 100vh;
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}

header .nav_btn{
width: 20px;
height: 20px;
margin: 0 auto 0 10px;
position: relative;
top: 48%;
cursor: pointer;
z-index: 11;
}

header .nav_line{
display: block;
width: 20px;
height: 1px;
border-top: 1px solid #e84b61;
margin: 0 auto;
position: absolute;
left: 0;
right: 0;
transition: all .4s;
box-sizing: border-box;
}

header .nav_line01{
top: 0;
}

header .nav_line02{
top: 9px;
}

header .nav_line03{
top: 19px;
}

header.active{
/* z-index:12; */
}

header.active_fast{
/* width: 100%;
max-width: none; */
z-index: 12;
/* background: #e84b61; */
overflow: hidden;
}

header::before{
content: "";
background: #e84b61;
width: 100%;
height: 100vh;
display: block;
position: absolute;
top: 0;
left: -100%;
transition: all .4s;
z-index: 11;
}

header.active_fastlate::before{
left: 0;
}

header.active .nav_btn{
margin: 0 auto 0 12px;
}

header.active .nav_line{
border-color: #000;
}

header.active .nav_btn .nav_line01{
	-webkit-transform: translateY(9px) rotate(-45deg);
	transform: translateY(9px) rotate(-45deg);
}

header.active .nav_btn .nav_line02.hover_line{
	-webkit-transform: translateX(9px) rotate(0deg);
	transform: translateX(9px) rotate(0deg);
}

header.active .nav_btn .nav_line02{
	top:12px;
	left: 50%;
	opacity: 0;
	-webkit-animation: active-menu-bar02 .8s forwards;
	animation: active-menu-bar02 .8s forwards;
}

header.active .nav_btn .nav_line03{
	-webkit-transform: translateY(-10px) rotate(45deg);
	transform: translateY(-10px) rotate(45deg);
}

nav{
display: none;
position: relative;
z-index: 10;
}

header.active nav{
display: block;
}

nav h1{
max-width: 460px;
margin: 0 auto;
padding: 0 0 32px;
}

nav h1 img{
width: 100%;
}

.nav_in li{
font-size: 36px;
line-height: 60px;
color: #000;
font-family: 'brandon-grotesque';
font-weight: 700;
text-align: center;
}

.nav_in .small_nav_box{
max-width: 868px;
margin: 3px auto 26px;
}

.nav_in .small_nav_box .box01{
max-width: 651px;
margin: 0 auto;
}

.nav_in .small_nav{
float: left;
text-align: center;
max-width: 139px;
width: 16.02%;
margin: 0 4.49% 18px;
}

.nav_in .small_nav_box .box01 .small_nav{
width: 21.35%;
margin: 0 5.99% 18px;
}

.nav_in .small_nav img{
max-width: 84px;
width: 100%;
height: auto;
display: block;
margin: 0 auto;
padding: 0 0 6px;
}

.nav_in .small_nav .product{
font-size: 16px;
line-height: 19px;
}

.nav_in .small_nav .product_jp{
font-size: 12px;
line-height: 14px;
/*font-family: "UD譁ｰ繧ｴ M";*/
font-family:Helvetica,Arial,Meiryo,'繝｡繧､繝ｪ繧ｪ','繝偵Λ繧ｮ繝手ｧ偵ざ Pro w3','Hiragino Kaku Gothic Pro,osaka','�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
margin: -2px 0 0;
}


/*----------
03.繧ｳ繝ｳ繝�Φ繝�
----------*/

#content{
/* width: 97.08%; */
margin: 0 0 0 40px;
position: relative;
z-index: 8;
}

/*----------
04.繝輔ャ繧ｿ繝ｼ
----------*/

footer{
background: #333;
padding: 66px 0 65px;
}

footer small{
display: block;
text-align: center;
color: #fff;
font-family: 'brandon-grotesque';
font-weight: 900;
}

@media all and (-ms-high-contrast:none) {

.nav_in li{
/*font-family: 'Avenir-Black';*/
font-family: 'brandon-grotesque';
}

footer small{
/*font-family: 'Avenir-Medium';*/
font-family: 'brandon-grotesque';
}
}

/*----------
05.info_area
----------*/

#info_area {
max-width: 1038px;
margin: 0 auto;
padding: 0 0 40px;
}

#info_area .contents_in{
max-width: none;
}

#info_area table{
border-top: 1px solid #000;
border-bottom: 1px solid #000;
max-width: 500px;
width: 48.28%;
float: left;
margin: 0 0.86%;
font-size: 12px;
/*font-family: "UD譁ｰ繧ｴ M";*/
font-family:Helvetica,Arial,Meiryo,'繝｡繧､繝ｪ繧ｪ','繝偵Λ繧ｮ繝手ｧ偵ざ Pro w3','Hiragino Kaku Gothic Pro,osaka','�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
}

#info_area th{
padding: 15px 0 15px 23px;
width: 148px;
text-align: left;
}

#info_area td{
padding: 15px 0;
}

#info_area tr:nth-child(1) th{
padding: 37px 0 15px 23px;
}

#info_area tr:nth-child(3) th{
padding: 15px 0 40px 23px;
}

#info_area table.table02 th{
padding: 15px 0 15px 36px;
}

#info_area table.table02 tr:nth-child(1) th{
padding: 37px 0 15px 36px;
}

#info_area table.table02 tr:nth-child(3) th{
padding: 15px 0 40px 36px;
}

/*----------
06.菴ｿ逕ｨ荳翫�豕ｨ諢�
----------*/

#attention_area{
}

#attention_area h3{
/*font-family: "UD譁ｰ繧ｴ B";*/
font-family:Helvetica,Arial,Meiryo,'繝｡繧､繝ｪ繧ｪ','繝偵Λ繧ｮ繝手ｧ偵ざ Pro w3','Hiragino Kaku Gothic Pro,osaka','�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
font-weight: bold;
font-size: 18px;
color: #333;
position: relative;
padding: 22px 0 20px 35px;
}

#attention_area h3::before{
height: 3px;
width: 20px;
border-top: 3px solid #000;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
}

#attention_area p{
max-width: 912px;
margin: 0 auto 0 35px;
line-height: 30px;
color: #000;
}






@media only screen and (max-width:1024px){
/*----------
01.蜈ｱ騾�
----------*/

.contents_in{
width: 93%;
}

/*----------
02.繝倥ャ繝€繝ｼ
----------*/


/*----------
03.繝輔ャ繧ｿ繝ｼ
----------*/

/*----------
05.info_area
----------*/

/*----------
06.菴ｿ逕ｨ荳翫�豕ｨ諢�
----------*/


}

@media only screen and (max-width:750px){
/*----------
01.蜈ｱ騾�
----------*/
.pc{
display: none;
}

.sp{
display: block;
}

/*----------
02.繝倥ャ繝€繝ｼ
----------*/

header{
/* display: none; */
height: auto;
background: #fff;
position: fixed;
max-width: none;
width: 100%;
padding: 4px 0 40px;
transition: all .2s;
z-index: 10;
}

header.active_fast{
height: 100vh;
}

header.sticky_under{
padding: 4px 0 10px;
}

header .nav_line{
border-top: 2px solid #000;
height: 2px;
}

header .nav_btn{
width: 20px;
height: 36px;
margin: 0 0 0 3%;
top: 0;
}

header .nav_line01{
top: 9px;
}

header .nav_line02{
top: 17px;
}

header .nav_line03{
top: 25px;
}



header.active_fast .nav_btn .nav_line01{
	-webkit-transform: translateY(8px) rotate(-45deg);
	transform: translateY(8px) rotate(-45deg);
}

header.active_fast .nav_btn .nav_line02.hover_line{
	-webkit-transform: translateX(8px) rotate(0deg);
	transform: translateX(8px) rotate(0deg);
}

header.active_fast .nav_btn .nav_line02{
	top:12px;
	left: 50%;
	opacity: 0;
	-webkit-animation: active-menu-bar02 .8s forwards;
	animation: active-menu-bar02 .8s forwards;
}

header.active_fast .nav_btn .nav_line03{
	-webkit-transform: translateY(-8px) rotate(45deg);
	transform: translateY(-8px) rotate(45deg);
}

header.active nav{
padding: 8px 10px 0;
box-sizing: border-box;
}

nav h1{
max-width: 280px;
width: 100%;
padding: 0 0 10px;
}

header.active_fast nav h1{
width: 70%;
}

header .header_in{
height: auto;
/* position: static; */
}

header::after{
content: none;
}

.nav_in li{
font-size: 18px;
line-height: 28px;
}

.nav_in .small_nav_box{
max-width: 290px;
margin: 5px auto -10px;
}

.nav_in .small_nav_box .box01.clearfix:after{
display: none;
}

.nav_in .small_nav_box .box02.clearfix:after{
display: none;
}

.nav_in .small_nav{
width: 48%;
margin: 0 1% 15px;
}

.nav_in .small_nav .product{
font-size: 12px;
line-height: 18px;
font-family: 'brandon-grotesque';
}

.nav_in .small_nav_box .box01 .small_nav{
width: 48%;
margin: 0 1% 15px;
}

.nav_in .box01 .small_nav:nth-child(3){
clear: both;
margin: 0 auto 15px;
float: none;
}

.nav_in .small_nav img{
max-width: 42px;
padding: 0 0 3px;
}





/*----------
03.繧ｳ繝ｳ繝�Φ繝�
----------*/
#content{
margin: 0 auto;
}


/*----------
04.繝輔ャ繧ｿ繝ｼ
----------*/

footer{
padding: 33px 0;
}

/*----------
05.info_area
----------*/

#info_area{
padding: 0 0 49px;
}

#info_area table{
max-width: none;
width: 100%;
border-bottom: none;
}

#info_area th{
width: 128px;
}

#info_area tr:nth-child(1) th{
padding: 18px 0 15px 23px;
}

#info_area tr:nth-child(3) th{
padding: 15px 0 15px 23px;
}

#info_area table.table02{
border-bottom: 1px solid #000;
border-top: none;
}

#info_area table.table02 th{
padding: 15px 0 15px 23px;
}

#info_area table.table02 tr:nth-child(1) th{
padding: 15px 0 15px 23px;
}

#info_area table.table02 tr:nth-child(3) th{
padding: 15px 0 18px 23px;
}

/*----------
06.菴ｿ逕ｨ荳翫�豕ｨ諢�
----------*/

#attention_area h3{
padding: 22px 0 20px;
text-align: center;
font-size: 15px;
}

#attention_area h3::before{
left: 0;
right: 0;
margin: 0 auto;
}

#attention_area p{
margin: 0 auto;
font-size: 12px;
line-height: 25px;
}

}