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


/*
#####################################################################

	目次【INDEX】

#####################################################################

■ボディ【body】

■リンク【a】

■画像【img】

■ラッパー【wrapper】

■コンテンツ【contents】

■ヘッダー【header】

　＿オプション

　＿ロゴ【.logo】

　＿ボックス【header_box】

■フッター【footer】

　＿ロゴ【.logo】

　＿ボックス【footer_box】



*/


/*
#####################################################################

	ボディ【body】

#####################################################################


@font-face {
  font-family: "overpass-regular";
  src: url('../fonts/overpass_regular.ttf')  format('truetype'),
  	   url("../fonts/overpass_regular.eot") format('eot'),
       url("../fonts/overpass_regular.woff") format('woff');
}

@font-face {
  font-family: "Overpass-Bold";
  src:	url('../fonts/Overpass-Bold.ttf')  format('truetype'),
  		url("../fonts/Overpass-Bold.eot") format('eot'),
		url("../fonts/Overpass-Bold.woff") format('woff');
}
*/
html {
	font-family:"YuGothic","游ゴシック","overpass-regular",overpass-regular,Helvetica,helvetica,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",arial, sans-serif;
	font-weight:500;
	word-break: normal;

	/*アンチエイリアスのかかり具合を指定するプロパティ*/
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	/*スマホで勝手に文字が大きくなる対策*/
	-webkit-text-size-adjust: 100%;
}


/*テキスト選択時のハイライトのカラー*/
*::selection { background: #ff6768; }
*::-moz-selection { background: #ff6768;}

body{ overflow-y:scroll;}


/*
#####################################################################

	リンク【a】

#####################################################################
*/

a{
	color: #1a1a1a;
	text-decoration:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);/*スマホ時ハイライトカラーを「無効」*/
}

a:hover{
	color: #1a1a1a;
	text-decoration:none;
}

/*
#####################################################################

    アンカーリンク【hr】

#####################################################################
*/
hr {
    display: block;
    margin: 0;
    padding: 0;
    width: auto;
    height: 0;
    border: 0;
    background: 0;
}

hr {
    margin-top: -80px;
    padding-top: 80px;
}


/*
#####################################################################

	ラッパー【wrapper】

#####################################################################
*/

.wrapper{
    margin: 0 auto;
    min-width: 1120px;
	max-width:1460px;
	padding:0 65px;
	position:relative;
}

.wrapper2{
    min-width: 1120px;
	padding:0 65px;
	position:relative;
}

.wrapper3{
    margin: 0 auto;
    min-width: 1060px;
	max-width:1060px;
	position:relative;
}

.wrapper4{
    margin: 0 auto;
    min-width: 1060px;
    max-width:1240px;
    position:relative;
}

@media screen and (max-width : 1300px){
	.wrapper,
.wrapper2{ padding:0 50px;}
}

@media screen and (max-width: 1280px) {
    .wrapper {
        padding: 0 50px;
    }
}

@media screen and (max-width : 1150px){
	header .wrapper2,
	footer .wrapper2{ padding:0 20px; }
}
@media screen and (max-width : 1280px){
	.wrapper4{ margin:0 20px; }
}

@media screen and (max-width: 479px) {
    .wrapper {
        padding: 0 20px;
				width: 100% !important;
				min-width: 0;
				box-sizing: border-box;
    }
}
/*
#####################################################################

	コンテンツ【contents】

#####################################################################
*/

/*サイト全体用*/
.top #contents,
.page #contents{ min-width: 1120px; overflow:hidden;}

#contents{
	/*min-width: 980px;*/
	overflow:hidden;
}
/*SP*/
@media screen and (max-width : 479px){
	.top #contents,
	.page #contents{ min-width: 320px; overflow:hidden;}
}

/*
#####################################################################

	共通指定

#####################################################################
*/

/* ****************************************************
  コモンスタイル01【.common-style-01】

  ＿ヘッダーモジュール

  ＿フッターモジュール

  ＿ファーストビューモジュール

***************************************************** */

.common-style-01 .header_container > .flexbox{ min-height:80px;}

.common-style-01 .col-box-s{  width: 225px;}

@media all and (-ms-high-contrast:none) {/*IE11ハック*/
	*::-ms-backdrop, .common-style-01 .header_container { padding-top:14px;}
}
@media all and (-ms-high-contrast:none) {/*IE10ハック*/
	.common-style-01 .header_container { padding-top:14px;}
}

/*ロゴ*/
.common-style-01 .logo{ z-index:10;}
.common-style-01 .logo,
.common-style-01 .logo img{  width: auto; height:32px;line-height: 32px; }
.common-style-01 .Navigation {
	max-width: 780px;
}


/*ナビゲーション*/
.common-style-01 .Navigation.pickup {
  max-width: 860px;
}
 .common-style-01 .head-top-fixed .Navigation a:after {
    content: "";
    background-color: #fff;
    display: block;
    width: 31px;
    height: 4px;
    margin-top: 6px;
}
.common-style-01 .Navigation a.noBorder:after {
    content: none;
}
.common-style-01 .Navigation a:hover {
    opacity: 1;
}
.common-style-01 .Navigation a:hover:after{
    background-color: #cc0000;
}
.common-style-01 .suvNav_container .Navigation a:hover:after{
    background-color: #ffffff;
}
.common-style-01 .Navigation a.active:after{
    background-color: #cc0000;
}
.common-style-01 .Navigation a.disable {
    color: rgba(255,255,255,.3);
}
.common-style-01 .Navigation a.disable:after{
    background-color: rgba(255,255,255,.3);
}

.common-style-01 .Navigation.n-pc a:hover::after,
.common-style-01 .Navigation.n-pc .active::after {
    background-color: #cd0001;
}

.common-style-01 .Navigation a.noactive{ cursor:default; filter: alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;}
.common-style-01 .Navigation.n-pc a.noactive::after{ background-color: transparent;}

.common-style-01 .dropdown_container{ padding-top: 3px;margin-top: 23px;}

@media all and (-ms-high-contrast:none) {/*IE11ハック*/
	*::-ms-backdrop, .common-style-01 .dropdown_container{ padding-top: 7px;}
}
@media all and (-ms-high-contrast:none) {/*IE10ハック*/
	.common-style-01 .dropdown_container{ padding-top: 7px;}
}

@media screen and (min-width : 480px){
	.common-style-01 .Navigation{  max-width: 780px;}
	.common-style-01 .dropdown_btn{ display:none;}
	.common-style-01 .slide-toggle .dropdown_body { display: inline!important; }
}
/*ログイン、レッドハッドロゴ*/
.common-style-01 .head-login{ min-width:110px; padding-top:5px; padding-left:15px;}
.common-style-01 .logo_rh{　min-width:110px;}

@media all and (-ms-high-contrast:none) {/*IE11ハック*/
	*::-ms-backdrop, .common-style-01 .head-login{ padding-top:5px;}
}
@media all and (-ms-high-contrast:none) {/*IE10ハック*/
	.common-style-01 .head-login{ padding-top:5px;}
}


/*サブナビゲーション*/
.common-style-01 .suvNav-module{
    position: absolute;width: 100%;
    top: 80px; left: 0; display:none;
	background-color:#000000;
}
.common-style-01 .suvNav-module .close-btn{z-index:1; -ms-transform: scale(0.7); -webkit-transform: scale(0.7); transform: scale(0.7);}
.common-style-01 .suvNav-module .close-btn::before,
.common-style-01 .suvNav-module .close-btn::after{ height:18px; width:2px;}
.common-style-01 .suvNav_container{  min-height:60px; padding-left:170px;}
.common-style-01 .suvNav_container .Navigation li{ margin-right:30px;}
.common-style-01 .suvNav_container .Navigation li:last-child{ margin:0;}

@media all and (-ms-high-contrast:none) {/*IE11ハック*/
	*::-ms-backdrop, .common-style-01 .suvNav_container { padding-top:22px; padding-left:162px;}
}
@media all and (-ms-high-contrast:none) {/*IE10ハック*/
	.common-style-01 .suvNav_container { padding-top:22px; padding-left:162px;}
}

@media screen and (max-width : 1300px){
	.common-style-01 .suvNav_container{  padding-left:135px;}
}




/*
#####################################################################

	ヘッダー【header】

#####################################################################
*/


/* ****************************************************
 オプション
***************************************************** */

/* 上下左右常に固定 */
.head-top-fixed,.head-bottom-fixed{ position:fixed; left:0; width:100%; z-index:10;}
.head-top-fixed{ top:0; }
.head-bottom-fixed{ bottom:0;}

.head-left-fixed,.head-right-fixed{ position:fixed; top:0; height:100%; z-index:10;}
.head-left-fixed{ left:0; }
.head-right-fixed{ right:0;}

/* 上下左右範囲内で固定 */
.head-top-absolute,.head-bottom-absolute{ position: absolute; left:0; width:100%; z-index:10;}
.head-top-absolute{ top:0; }
.head-bottom-absolute{ bottom:0;}

.head-left-absolute,.head-right-absolute{ position:absolute; top:0; height:100%; z-index:10;}
.head-left-absolute{ left:0; }
.head-right-absolute{ right:0;}

header .logo,
header .logo img{
	width:134px;
	height:32px;line-height: 32px;
}


/* ****************************************************
  ヘッダーモジュール【.header-module】
***************************************************** */

.header-module{}

#TOP .header-module,
#TOP .header-module .header_container,
 .Navigation.n-pc a::after,
#TOP .header-module .Navigation .active::after{ -webkit-transition: all .3s ease;
	transition: all .3s ease;}
#TOP .header-module{}
#TOP .header-module.active .header_container{ background:#1a1a1a;/* min-height:80px;*/}
/*#TOP .header-module.active .Navigation .active::after{bottom: -26px;height: 4px;}*/

/*ナビゲーション*/
.header-module .Navigation a{ color:#FFF;}
.header-module .suvNav-module{ background-color:#cd0001;}

.header-module .header_container .col-box-s{ min-width:190px; max-width:190px;z-index: 100;}
@media screen and (max-width : 1200px){
.header-module .header_container .col-box-s{ min-width:160px; max-width:160px;z-index: 100;}
}
/*SP*/
.menu_btn{
	display: none;
}

.header-module .b_border.b_colorWhite{
	white-space: nowrap;
}

@media screen and (max-width : 479px){
	/*ロゴ*/
	.common-style-01 .logo{ z-index:10;}
	.common-style-01 .logo,
	.common-style-01 .logo img{text-align: left;}
header .wrapper2{
	height: 52px;
}

.header-module .common-style-01 .col-box-s{
	 z-index: 100;
	 position: fixed;
	 left: 15px;
	 top:15px;
}
.header-module .common-style-01 .logo, .common-style-01 .logo img {
    width: auto;
    height: 27px;
    line-height: 27px;

}

.header-module .nav_link,.header-module .my_link{
		display: none;
}


.header-module .menu_btn{
	position: fixed;
	right: 0;
	top:0;
	display: block;
	padding: 15px;
	z-index: 10;
}
.header-module .menu-trigger,
.header-module .menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.header-module .menu-trigger {
  position: relative;
  width: 22px;

  height: 20px;
}
.header-module .menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
  border-radius: 4px;
}
.header-module .menu-trigger span:nth-of-type(1) {
  top: 0;
}
.header-module .menu-trigger span:nth-of-type(2) {
  top: 9px;
}
.header-module .menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

.header-module .nav_link{
	position: fixed !important;
	left: 0;
	top:0;
	width: 100%;
	z-index: 0;
	height:0;
	overflow: hidden;
	opacity: 0;
	transition:height .2s;
	background-color: #000;
	display: block;
}

.open .nav_link{
	height: 100%;
	opacity: 1;
}

.header-module .Navigation li:first-child{
	 margin-top: 50vh;

}
.header-module .suvNav_container{
	padding-left: 0;
}
.header-module .suvNav_container .Navigation {
    max-width: 780px;
}
.header-module .suvNav_dropdown_body .Navigation li{
margin-top: 0;
margin-right: 0;
padding-top: 0px;
transform: translate(0,0);
}
header .wrapper2 {
    height: 52px;
}
.header-module .suvNav_dropdown_body .Navigation li a{
	font-size: 15px;
	;

}

.header-module .suvNav_dropdown_body .Navigation li a::after{
	display: none;
}
.header-module .Navigation li{
	transform: translate(0,-320px);
	padding: 1.5vh;
	font-size: 18px !important;
}
.header-module .my_link .flexbox,
.nav_link	.flexbox{
	text-align: center;
display: block !important;
}

.header-module .my_link{
	position: fixed !important;
	left: 0;
	top: 75vh;
	margin-top:-70px;
	width: 100%;
	z-index: 10;
}
@media screen and (max-width : 380px){
	.header-module .Navigation li{
		transform: translate(0,-280px);

	}
	.header-module .my_link{
		position: fixed !important;
		left: 0;
		top: 75vh;
		margin-top:-50px;
	}
}
@media screen and (max-width : 330px){
	.header-module .Navigation li{
		transform: translate(0,-240px);
		padding: 1vh;
		font-size: 18px !important;
	}
	.header-module .my_link{
		position: fixed !important;
		left: 0;
		top: 75vh;
		margin-top:-30px;
	}
}
.header-module .my_link li{
	display: block !important;
	padding: 1.5vh;
	font-size: 18px !important;
}
.header-module .button.login {
    margin-right: 0 !important;
	}
.header-module .nav_link	.no_link::after,
.header-module .nav_link	.link::after{
	display: none !important;
}
.my_link,
.nav_link{

	transition: .2s;
	opacity: 0;
	pointer-events: none;
	display: block !important;
}
.open .my_link,
.open .nav_link
{
	pointer-events:auto;
	opacity: 1;
}

.open .menu-trigger span:nth-of-type(1) {
  -webkit-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg);
}
.open .menu-trigger span:nth-of-type(2) {
  opacity: 0;
}
.open .menu-trigger span:nth-of-type(3) {
  -webkit-transform: translateY(-9px) rotate(45deg);
  transform: translateY(-9px) rotate(45deg);
}

}

/*
#####################################################################

	フッター【footer】

#####################################################################
*/

/* ****************************************************
  フッターモジュール01【.footer-module】
***************************************************** */

.footer-module{}


/*ナビゲーション*/
.footer-module .Navigation a{ color:#FFF;transition: .2s}
.footer-module .Navigation a:hover{ opacity: 0.6}


.separate-h-s{ color:#666666; margin:-1px 12px 0;}
.footer-module .n_hamburger span{ background-color:#FFFFFF !important;}

.footer-module .Navigation.flexContent-end{  max-width: 100%;}

/*SP*/

@media screen and (max-width : 479px){
	.footer-module .flexbox{
		 display: block !important;
	}
	.footer-module .separate-h-s,
	.footer-module .n-pc.Navigation{
		display: none !important;

	}
	.footer_container .col-box-s{
		width: auto !important;
	}
	.footer-module .wrapper2 {
	    min-width: 320px;
			text-align: center;
	}
	.footer-module .alignRight {
	    text-align: center !important;
	}
	.footer-module .margin-t-m{
		    margin-top: 20px!important;
				margin-bottom: 22px !important;
	}
	.footer-module .margin-t-m a{
		font-size: 12px;
		margin-top: 3px;
		display: inline-block;
	}
	.footer-module.padding-tb-m {
	    padding-top: 24px !important;
	    padding-bottom: 26px !important;
	}

}
/* ****************************************************
  ロゴ【.logo】
***************************************************** */

footer .logo{}

/* ****************************************************
  ボックス【footer_box】
***************************************************** */
.footer_box01{}
.footer_box02{}
.footer_box03{}