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


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

	目次【INDEX】
	
#####################################################################

■タイポグラフィ

　＿注釈、補足情報【Small Text】

　＿色【Color】

　＿文字揃え【TextAlign】

　＿ボールド【.bold】

　＿イタリック【.italic】

　＿大文字小文字指定【.textTransform】


■ナビゲーション【navigation】

　＿ナビゲーション【Navigation】

　＿Fixed固定ナビゲーション【fixed-nav】

　＿ポップアップメニュー【.n_popup_menu】

　＿アイコン化ボタン【.Navigation_icon】


■リンク【Link】

　＿リンク【Link】

　＿アニメーション：下線伸縮【link-animeline01】


■アイコン

　＿アイコンボックス【icon-box】

　＿アイコン一覧

　＿アイコンカラー【icon-color】


■フォーム【button, input, optgroup, select, textarea】

　＿セレクトフォーム【f_select】


■スライダー【flexslider】

　＿スライダー【flexslider】

　＿シンプルスライダー【s_simple】



■その他モジュール

　＿色【bg-Color】

　＿影【bg-shadow】

　＿形【bg-Radius】

　＿線【bg-Border】

　＿揃え位置【position】

　＿マージン・パディング【margin・padding】

　＿Fixed固定ナビゲーション【fixed-nav】

　＿ページトップ【pagetop】

　＿レスポンシブ表示非表示【none】

　＿レスポンシブ画像【responsive-img】

　＿float解除【Clear fix】




■トランジョン




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

	タイポグラフィ
	
#####################################################################
*/

/* ****************************************************
  見出し【heading】
***************************************************** */

/*JP*/
.heading1, .heading2, .heading3, .heading4, .heading5, .heading6, .heading7{
    font-weight: bold;
	letter-spacing:-0.04rem;
    margin: 0;
}

.heading1 { font-size: 2.5rem; }

/*EN*/
.heading1-EN, .heading2-EN, .heading3-EN, .heading4-EN, .heading5-EN, .heading6-EN, .heading7-EN{
	letter-spacing:0.05rem;
    margin: 0;
}

.heading1-EN { font-size: 1.2rem; margin:0 auto 70px auto; font-weight:600; text-align:center; } /*各見出し*/

@media screen and (max-width : 479px){
	
	.heading1-EN { margin:0 auto 40px auto; } /*各見出し*/
}

/* ****************************************************
  注釈、補足情報【Small Text】
***************************************************** */

.small1 { font-size: 0.7rem; }
.small2 { font-size: 0.9rem; }


/* ****************************************************
  ボールド【.bold】
***************************************************** */

/*通常の文字用*/
.bold1,bold2,bold3{
	/*アンチエイリアスのかかり具合を指定するプロパティ*/
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: auto;
}
.bold1{ font-weight:400 !important;}
.bold2{ font-weight:500 !important;}
.bold3{ font-weight:600 !important;}

/*白抜き用（Macで太くなる為）*/
.boldW1{ font-weight:400 !important;}
.boldW2{ font-weight:500 !important;}
.boldW3{ font-weight:600 !important;}

/* ****************************************************
  イタリック【.italic】
***************************************************** */

.italic{
	font-style:italic;
}

/* ****************************************************
  大文字小文字指定【.textTransform】
***************************************************** */

/*単語の先頭文字を大文字*/
.textTransform-capitalize{ text-transform:capitalize;}

/*全て大文字*/
.textTransform-uppercase{ text-transform:uppercase;}

/*全て小文字*/
.textTransform-lowercase{ text-transform:lowercase;}



/* ****************************************************
  色【Color】
***************************************************** */

/*※必要に応じて追加*/

.colorBlack{ color:#1a1a1a;}/*ブラック*/
.colorGray{ color:#83838f;}/*グレー*/
.colorRed{ color:#c93434;}/*レッド*/
.colorOrange{ color:#f5683a;}/*オレンジ*/
.colorBlue-light{ color:#55acee;}/*ブルーライト*/
.colorBlue{ color:#5887ab;}/*ブルー*/
.colorBlue-dark{ color:#3a5897;}/*ダークブルー*/
.colorPink{ color:#f26b88;}/*ピンク*/


/* ****************************************************
  文字揃え【TextAlign】
***************************************************** */

.alignLeft { text-align: left !important; }/*左寄せ*/
.alignCenter { text-align: center !important; }/*中央寄せ*/
.alignRight { text-align: right !important; }/*右寄せ*/


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

	ナビゲーション【Navigation】
	
#####################################################################
*/

/* ****************************************************
  ナビゲーション【Navigation】
***************************************************** */

.Navigation a{
	display:block;
	width:100%;
	height:100%;
	
}
/*詳細設定*/
.Navigation{
	text-transform:uppercase;
	font-size:0.87rem;
}


/*オフィシャルサイト制御*/
.offialurl-none .Navigation li.offialurllink{
	display:none;
}

.Navigation.childCategories {
    display: flex;
    -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack:center; justify-content: center; 
    margin: -20px 0 55px;
}


@media screen and (max-width : 479px){
	.Navigation{ background-color:#FFF;}
	.Navigation .row-inbox{
		display:block;
		text-align:center;
		min-height:50px;
		line-height:50px;
		border-bottom:1px solid #f7f7f7 ; 
	}
	.Navigation .row-inbox:last-child{
		border:none;
	}
	/*ホバー時*/
	.Navigation .row-inbox:hover{
		background-color:rgba(0, 0, 0, 0.1);
	}
}

/* ****************************************************
  Fixed固定ナビゲーション【fixed-nav】
***************************************************** */

.fixed-nav{
	background-color:#FFF ;
	margin:0;
	padding:13px 0 10px 0;
	
	box-shadow:rgba(0, 0, 0, 0.1) 0px 10px 20px 0px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.1) 0px 10px 20px 0px;
	-moz-box-shadow:rgba(0, 0, 0, 0.1) 0px 10px 20px 0px;
}
.Navigation-icon.fixed-nav{
	height:50px;
}

.fixed-nav .n_popup-menu,
.fixed-nav .n_popup-menu a{
	text-align:left;
}

.fixed-nav-none{
	display:none;
}

@media screen and (max-width : 479px){
	.fixed-nav{
		padding:0;
	}
	.fixed-nav .n_popup-menu,
	.fixed-nav .n_popup-menu a{
		text-align:center;
	}
	.Navigation-icon.fixed-nav{
		height:40px;
	}
}

/* ****************************************************
  ポップアップメニュー【.n_popup_menu】
***************************************************** */

.n_popup-box{ position:relative;}

.n_popup-menu{
	position:absolute;
	left:0;
	
	filter: alpha(opacity=0);
	-moz-opacity:0;opacity:0;
	
	width: max-content;
	width:-webkit-max-content;
	width: -moz-max-content;
}
.n_popup-box:hover .n_popup-menu,
.n_popup-menu.hover{
	display: inline;
	filter: alpha(opacity=100);
	-moz-opacity:1.0;opacity:1.0;
}

/*詳細設定*/
.n_popup-box{
	height:105px;
}
.n_popup-menu{
	display:none;
	min-width:200px;
    padding:16px 20px;
	top:23px;
}
.n_popup-menu a:hover{
	text-decoration:underline;
}

.appsItemCategoryTag_lowerchild{
    padding-left: 10px;
}

@media screen and (max-width : 479px){
	/*.n_popup-box{
		height:100%;
	}*/
	.n_popup-box{ height:auto; position:relative; background-color:#FFF; padding:15px 0}
	
	.n_popup-box span{ display:none;}
	
	.n_popup-menu{
		position:relative;
		display: inline;
		filter: alpha(opacity=100);
		-moz-opacity:1.0;opacity:1.0;
		min-width:100%;
		margin:0;
		padding:15px 0;
		border:none;
		top:0px;
	}
	.n_popup-menu li{
		min-height:50px;
		line-height:1.5;
		background-color:#FFF;
		border:none;
	}
	
	.appsItemCategoryTag_lowerchild {
		padding-left:0px;
	}
	.n_popup-menu .appsItemCategoryTag_lowerchild li{
		min-height:14px;
		margin: 14px 10px;
	}

}



/* ****************************************************
  アイコン化ボタン【.Navigation_icon】
***************************************************** */

.Navigation-icon{ width:100%; position: relative; top:0; z-index:100;}
.n_icon-box{  position: absolute; display:none;}
.n_icon-box li{ position:absolute; top:0; left:0;}
.n_icon-box .n_btn-off{ display:none; /*閉じるボタン隠す*/}


/*詳細設定*/
.Navigation-icon{ height:40px; margin-bottom:50px;}
.n_icon-box,
.n_icon-box .icon-box{
	width:40px;
	height:40px;
}
.n_icon-box{ right:0;}
.n_icon-box .icon-box::before{ font-size:20px; line-height:40px; }

.n_icon-box a{
	text-decoration:none;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
	text-align:center;
}


@media screen and (max-width : 479px){
	.n_icon-box{ display: block; }
}


/*↓↓↓↓↓ 以下ナビゲーション設定 ↓↓↓↓↓*/

/*********** アコーディオン表示【.accordion_menu】 *************/

.accordion_menu{}
@media screen and (min-width : 480px){
	.accordion_menu{ display:block !important;}
}

@media screen and (max-width : 479px){
	.Navigation-icon{ position: absolute;}
	.accordion_menu{ display:none ; position:relative;}
	/*詳細設定*/
	.accordion_menu{
		top:40px; overflow-y:scroll !important; min-height:300px; height:80vh;
	}
}

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

	リンク【Link】
	
#####################################################################

*/

/* ****************************************************
  リンク【link】
***************************************************** */

.link{
    cursor: pointer;
	background: transparent none repeat scroll 0 0;
}

.pagetop .link:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
}

/* ****************************************************
  アニメーション：下線伸縮【link-animeline01】
***************************************************** */

.link-animeline01 span {
  background: -webkit-linear-gradient(#1a1a1a, #1a1a1a) center 1.09em no-repeat;
  background: linear-gradient(#1a1a1a, #1a1a1a) center 1.16em no-repeat;

  background-size: 0% 1px;
}

.link-animeline01 span:hover { background-size: 100% 1px; }


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

	アイコン
	
#####################################################################
*/

.icon-box::before,
.icon-txt::before {
    display: inline-block;
    font-family: "FontAwesome";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    text-transform: none;
    vertical-align: middle;
}

/* ****************************************************
  アイコンボックス【icon-box】
***************************************************** */

.icon-box{
	display:block;
	width:40px;
	height:40px;
	text-align:center;
}

.icon-box::before{
	line-height:40px;
}

/* ****************************************************
  アイコン一覧
***************************************************** */

.icon-bars::before{ content: "\f0c9"; }/*bars ※ナビアイコン（三）*/
.icon-times::before{ content: "\f00d"; }/*times ※バツ（×）*/ 
.icon-caret-down::before{ content: "\f0d7"; }/*アイコン種類(下矢印)*/

/*アイコン種類(上矢印)*/
.icon-chevron-circle-up::before{ content: "\f139"; }
.icon-chevron-up::before{ content: "\f077"; }
.icon-caret-square-o-up::before{ content: "\f151"; }



/* ****************************************************
  アイコンカラー【icon-color】
***************************************************** */

.icon-colorWhite::before{ color:#FFF;}/*ホワイト*/
.icon-colorBlack::before{ color:#1a1a1a;}/*ブラック*/
.icon-colorGray::before{ color:#83838f;}/*グレー*/
.icon-colorRed::before{ color:#c93434;}/*レッド*/
.icon-colorOrange::before{ color:#f5683a;}/*オレンジ*/
.icon-colorBlue-light::before{ color:#55acee;}/*ブルーライト*/
.icon-colorBlue::before{ color:#5887ab;}/*ブルー*/
.icon-colorBlue-dark::before{ color:#3a5897;}/*ダークブルー*/
.icon-colorPink::before{ color:#f26b88;}/*ピンク*/

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

	フォーム【button, input, optgroup, select, textarea, button】
	
#####################################################################
*/

/* ****************************************************
  セレクトフォーム【f_select】
***************************************************** */
.f_select{
	position:relative;
}
.f_select select{
    cursor: pointer;
    min-width: inherit;
    vertical-align: middle;
}
/*詳細設定*/
.f_select select{
	padding: 5px 25px 5px 10px;
	border: 1px solid #ccc;
}

.f_select #i18{ position: unset !important;}

.f_select #i18 div{ position:relative; margin-right:3px;}
.f_select #i18 div::before{
	font-family: "FontAwesome";
    content: "\f0d7";
    position: absolute;
    right: 10px;
    top: 4px;
	font-size:14px;
	color:#999999;
	width:10px;
	height:7px;
	
}

/* Safari 3以上, Chrome*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	 .f_select #i18 div::before{
		 display:none;
	 }
}
/*IE10▼*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.f_select #i18 div::before{
		 display:none;
	 }
}


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

	スライダー【flexslider】
	
#####################################################################
*/


/* ****************************************************
  スライダー【flexslider】
***************************************************** */

/*リセット*/
.flex-container a:active,.flexslider a:active,.flex-container a:focus,.flexslider a:focus  {outline: none;}
.slides,.flex-control-nav,.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/*No JavaScript*/
.no-js .slides > li:first-child {display: block;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/*デフォルト設定*/
.flexslider { margin: 0; padding: 0; z-index:0; position: relative; zoom: 1; }
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.carousel li { margin-right: 5px; }

/*詳細設定*/
.flexslider{
}



/*スライドエリア【slides】
*********************************************** */

/*デフォルト設定*/
.flexslider .slides { zoom: 1; }
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;}
.flexslider .slides img {width: 100%; display: block;}

/*詳細設定*/
.flexslider .slides li{
	width:100%;
	height: auto;
}



/*左右ナビボタン【flex-direction-nav】
*********************************************** */

/*デフォルト設定*/
.flex-direction-nav a  { text-decoration:none; display: block; position: absolute; z-index:0; overflow: hidden; cursor: pointer; }
.flex-direction-nav a::before{ display: inline-block; vertical-align:middle; }
.flex-direction-nav a.flex-next::before,
.flex-direction-nav a.flex-prev::before { font-family: "FontAwesome";}

/*詳細設定*/
.flex-direction-nav a {
	opacity: 0.25;
	top:42%;
	margin:0;	
	width:40px;
	height:40px;
	margin-top:-20px;
	color:#1a1a1a;
}

.flex-direction-nav .flex-prev { left: -30px; }
.flex-direction-nav .flex-next { right: -30px; ; text-align: right; }
.flexslider:hover .flex-prev { opacity: 1; }
.flexslider:hover .flex-next { opacity: 1; }

.flex-direction-nav a.flex-next::before  { content: "\f105"; }
.flex-direction-nav a.flex-prev::before  { content: "\f104"; }
.flex-direction-nav a::before{ font-size:2.5rem; line-height:50px;}

@media screen and (max-width : 991px){
	.flex-direction-nav .flex-prev { left: 20px; }
.flex-direction-nav .flex-next { right: 20px;}
}

@media screen and (max-width : 479px){
	.flex-direction-nav a  { opacity: 0.7; }
	.flex-direction-nav .flex-prev,
	.flexslider:hover .flex-prev { left: 10px; }
	.flex-direction-nav .flex-next,
	.flexslider:hover .flex-next { right: 10px; }
	.flex-direction-nav a::before{ font-size:1.575rem; line-height:40px;}
}


/*ナビ機能停止*/
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }

/*○ボタン【flex-control-paging】
*********************************************** */

/*デフォルト設定*/
.flex-control-nav {width: 100%; position: absolute; text-align: center;}
.flex-control-nav li { display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a { display: block; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; }
.flex-control-paging li a.flex-active {  cursor: default; }

/*詳細設定*/
.flex-control-nav{ bottom:10px; }
.flex-control-nav li { margin: 0 10px; }
.flex-control-paging li a{
	width: 9px;
	height: 9px;
	background-color:#999999;
}
.flex-control-paging li a:hover {
	filter: alpha(opacity=70);
	-moz-opacity:0.7;opacity:0.7;
}
.flex-control-paging li a.flex-active{
	background-color: transparent;
	border:1px solid #1a1a1a;
	box-sizing:border-box;
	line-height:1.5;
}



/* ****************************************************
  シンプルスライダー【s_simple】
***************************************************** */

.s_simple{
	margin:-30px 0 100px 0;
	overflow:hidden;
	min-width:980px;
}


@media screen and (max-width : 479px){
	.s_simple{ margin:0 0 70px; overflow: hidden; min-width:100%;}
}

/* ****************************************************
  シンプルスライダー【s_simple02】
***************************************************** */

.s_simple02{
}

.s_simple02 .flex-control-nav{ bottom:-40px; }

@media screen and (max-width : 479px){
	.s_simple02 .flex-control-nav{ display:none; }
}



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

	その他モジュール
	
#####################################################################
*/


/* ****************************************************
  色【bg-Color】
***************************************************** */

.bg-gray { background: #f7f7f7 none repeat scroll 0 0; }
.bg-gray2 { background: #eaeaea none repeat scroll 0 0; }
.bg-black { background: #1a1a1a none repeat scroll 0 0; }

/* ****************************************************
  影【bg-shadow】
***************************************************** */

/*外側ボトムにシャドウ*/
.bg-shadow{
	box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 30px 0px;
	-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 30px 0px;
	-moz-box-shadow:rgba(0, 0, 0, 0.3) 0px 10px 30px 0px;
}

/*内側にシャドウ*/
.bg-shadow-inner{
	
	box-shadow:rgba(0, 0, 0, 0.19) 0px 1px 5px 0px inset;
	-webkit-box-shadow:rgba(0, 0, 0, 0.19) 0px 1px 5px 0px inset;
	-moz-box-shadow:rgba(0, 0, 0, 0.19) 0px 1px 5px 0px inset;
}

/*外側にシャドウ*/
.b_shadow-outer {
    background-color: #fff;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
}

/* ****************************************************
  形【bg-Radius】
***************************************************** */

/*円*/
.bg-Radius-full{
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

/* ****************************************************
  線【bg-Border】
***************************************************** */

.bg-Border-Gray{ border:1px solid #7A8590; }

/* ****************************************************
  揃え位置【position】
***************************************************** */

.position-left{ margin:auto auto auto 0; }/*左揃え*/
.position-center{ margin:auto; }/*中心揃え*/
.position-right{ margin:auto 0 auto auto; }/*右揃え*/

@media screen and (max-width : 767px){
	.position-left,
	.position-center,
	.position-right{ margin:auto; }/*中心揃え*/
}


/* ****************************************************
  マージン・パディング【margin・padding】
***************************************************** */

/*上下左右*/
.margin-xs{ margin:10px!important;}
.margin-s{ margin:25px!important;}
.margin-m{ margin:30px!important;}
.margin-l{ margin:60px!important;}
.margin-xl{ margin:90px!important;}

.padding-xs{ padding:10px!important;}
.padding-s{ padding:20px!important;}
.padding-m{ padding:30px!important;}
.padding-l{ padding:60px!important;}
.padding-xl{ padding:90px!important;}

/*上下*/
.margin-tb-xs{ margin-top:10px!important; margin-bottom:10px !important;}
.margin-tb-s{ margin-top:25px!important; margin-bottom:25px!important; }
.margin-tb-m{ margin-top:30px!important; margin-bottom:30px!important;}
.margin-tb-l{ margin-top:60px!important; margin-bottom:60px!important;}
.margin-tb-xl{ margin-top:90px!important; margin-bottom:90px !important;}

.padding-tb-xs{ padding-top:10px!important; padding-bottom:10px !important;}
.padding-tb-s{ padding-top:25px!important; padding-bottom:25px!important; }
.padding-tb-m{ padding-top:30px!important; padding-bottom:30px!important;}
.padding-tb-l{ padding-top:60px!important; padding-bottom:60px!important;}
.padding-tb-xl{ padding-top:90px!important; padding-bottom:90px !important;}

/*上*/
.margin-t-xs{ margin-top:10px!important;}
.margin-t-s{ margin-top:25px!important; }
.margin-t-m{ margin-top:30px!important; }
.margin-t-l{ margin-top:60px!important; }
.margin-t-xl{ margin-top:90px!important; }

.padding-t-xs{ padding-top:10px!important;}
.padding-t-s{ padding-top:25px!important; }
.padding-t-m{ padding-top:30px!important; }
.padding-t-l{ padding-top:60px!important; }
.padding-t-xl{ padding-top:90px!important; }

/*下*/
.margin-b-xs{ margin-bottom:10px !important; }
.margin-b-s{ margin-bottom:25px!important; }
.margin-b-m{ margin-bottom:30px!important; }
.margin-b-l{ margin-bottom:60px!important; }
.margin-b-xl{ margin-bottom:90px !important; }

.padding-b-xs{ padding-bottom:10px !important; }
.padding-b-s{ padding-bottom:25px!important; }
.padding-b-m{ padding-bottom:30px!important; }
.padding-b-l{ padding-bottom:60px!important; }
.padding-b-xl{ padding-bottom:90px !important; }


/*左右*/
.margin-lr-xs{ margin-left:10px!important; margin-right:10px !important;}
.margin-lr-s{ margin-left:20px!important; margin-right:20px!important; }
.margin-lr-m{ margin-left:40px!important; margin-right:40px!important;}
.margin-lr-l{ margin-left:50px!important; margin-right:50px!important;}
.margin-lr-xl{ margin-left:60px!important; margin-right:60px !important;}

.padding-lr-xs{ padding-left:10px!important; padding-right:10px !important;}
.padding-lr-s{ padding-left:20px!important; padding-right:20px!important; }
.padding-lr-m{ padding-left:40px!important; padding-right:40px!important;}
.padding-lr-l{ padding-left:50px!important; padding-right:50px!important;}
.padding-lr-xl{ padding-left:60px!important; padding-right:60px !important;}


/*右*/
.margin-r-xs{ margin-right:10px!important; }
.margin-r-s{ margin-right:20px!important; }
.margin-r-m{ margin-right:40px!important; }
.margin-r-l{ margin-right:50px!important; }
.margin-r-xl{ margin-right:60px!important; }

.padding-r-xs{ padding-right:10px!important; }
.padding-r-s{ padding-right:20px!important; }
.padding-r-m{ padding-right:40px!important; }
.padding-r-l{ padding-right:50px!important; }
.padding-r-xl{ padding-right:60px!important; }

/*左*/
.margin-l-xs{ margin-left:10px!important; }
.margin-l-s{ margin-left:20px!important; }
.margin-l-m{ margin-left:40px!important; }
.margin-l-l{ margin-left:50px!important; }
.margin-l-xl{ margin-left:60px!important; }

.padding-l-xs{ padding-left:10px!important; }
.padding-l-s{ padding-left:20px!important; }
.padding-l-m{ padding-left:40px!important; }
.padding-l-l{ padding-left:50px!important; }
.padding-l-xl{ padding-left:60px!important; }

/*ネガティブマージン（微調整用）*/
.margin-nt-xs{ margin-top:-2px!important;}
.margin-nt-s{ margin-top:-3px!important;}
.margin-nt-m{ margin-top:-6px!important;}
.margin-nt-l{ margin-top:-8px!important;}
.margin-nt-xl{ margin-top:-10px!important;}

.margin-nl-xs{ margin-left:-8px!important;}
.margin-nl-s{ margin-left:-16px!important;}
.margin-nl-m{ margin-left:-24px!important;}
.margin-nl-l{ margin-left:-32px!important;}
.margin-nl-xl{ margin-left:-40px!important;}

@media screen and (max-width : 479px){
	
	
	/*上下左右*/
	.margin-xs,
	.margin-s{ margin:18px!important;}
	.margin-m{ margin:20px!important;}
	.margin-l{ margin:30px!important;}
	.margin-xl{ margin:45px!important;}
	
	.padding-xs,
	.padding-s{ padding:18px!important;}
	.padding-m{ padding:20px!important;}
	.padding-l{ padding:30px!important;}
	.padding-xl{ padding:45px!important;}
	
	/*上下*/
	.margin-tb-xs,
	.margin-tb-s{ margin-top:18px!important; margin-bottom:18px !important;}
	.margin-tb-m{ margin-top:20px!important; margin-bottom:20px!important;}
	.margin-tb-l{ margin-top:30px!important; margin-bottom:30px!important;}
	.margin-tb-xl{ margin-top:45px!important; margin-bottom:45px!important;}
	
	.padding-tb-xs,
	.padding-tb-s{ padding-top:18px!important; padding-bottom:18px !important;}
	.padding-tb-m{ padding-top:20px!important; padding-bottom:20px!important;}
	.padding-tb-l{ padding-top:30px!important; padding-bottom:30px!important;}
	.padding-tb-xl{ padding-top:45px!important; padding-bottom:45px!important;}
	
	/*上*/
	.margin-t-xs,
	.margin-t-s{ margin-top:18px!important;}
	.margin-t-m{ margin-top:20px!important; }
	.margin-t-l{ margin-top:30px!important; }
	.margin-t-xl{ margin-top:45px!important; }
	
	.padding-t-xs,
	.padding-t-s{ padding-top:18px!important;}
	.padding-t-m{ padding-top:20px!important; }
	.padding-t-l{ padding-top:30px!important; }
	.padding-t-xl{ padding-top:45px!important; }
	
	/*下*/
	.margin-b-xs,
	.margin-b-s{ margin-bottom:18px!important;}
	.margin-b-m{ margin-bottom:20px!important; }
	.margin-b-l{ margin-bottom:30px!important; }
	.margin-b-xl{ margin-bottom:45px!important; }
	
	.padding-b-xs,
	.padding-b-s{ padding-bottom:18px!important;}
	.padding-b-m{ padding-bottom:20px!important; }
	.padding-b-l{ padding-bottom:30px!important; }
	.padding-b-xl{ padding-bottom:45px!important; }
	
	
	/*左右*/
	.margin-lr-xs,
	.margin-lr-s{ margin-left:10px!important; margin-right:10px !important;}
	.margin-lr-m{ margin-left:15px!important; margin-right:15px !important;}
	.margin-lr-l,
	.margin-lr-ll,
	.margin-lr-xl{ margin-left:30px!important; margin-right:30px !important;}
	
	.padding-lr-xs,
	.padding-lr-s{ padding-left:10px!important; padding-right:10px !important;}
	.padding-lr-m{ padding-left:15px!important; padding-right:15px !important;}
	.padding-lr-l,
	.padding-lr-ll,
	.padding-lr-xl{ padding-left:30px!important; padding-right:30px !important;}
	
	/*右*/
	.margin-r-xs,
	.margin-r-s{ margin-right:10px!important; }
	.margin-r-m{ margin-right:15px!important; }
	.margin-r-l,
	.margin-r-ll,
	.margin-r-xl{ margin-right:30px!important; }
	
	.padding-r-xs,
	.padding-r-s{ padding-right:10px!important; }
	.padding-r-m{ padding-right:15px!important; }
	.padding-r-l,
	.padding-r-ll,
	.padding-r-xl{ padding-right:30px!important; }
	
	/*左*/
	.margin-l-xs,
	.margin-l-s{ margin-left:10px!important; }
	.margin-l-m{ margin-left:15px!important; }
	.margin-l-l,
	.margin-l-ll,
	.margin-l-xl{ margin-left:30px!important; }
	
	.padding-l-xs,
	.padding-l-s{ padding-left:10px!important; }
	.padding-l-m{ padding-left:15px!important; }
	.padding-l-l,
	.padding-l-ll,
	.padding-l-xl{ padding-left:30px!important; }
	
	/*ネガティブマージン（微調整用）*/
	.margin-nt-xs,
	.margin-nt-s,
	.margin-nt-m,
	.margin-nt-l,
	.margin-nt-xl{ margin-top:0px!important;}
	
	.margin-nl-xs,
	.margin-nl-s,
	.margin-nl-m,
	.margin-nl-l,
	.margin-nl-xl{ margin-left:0px!important;}

}

/*マージンパーセント指定*/
.margin2-lr-xs{ margin-left:3%!important; margin-right:3% !important;}
.margin2-lr-s{ margin-left:10%!important; margin-right:10%!important; }
.margin2-lr-m{ margin-left:20%!important; margin-right:20%!important;}
.margin2-lr-l{ margin-left:25%!important; margin-right:25%!important;}
.margin2-lr-xl{ margin-left:30%!important; margin-right:30% !important;}

.margin2-r-xs{ margin-right:3%!important; }
.margin2-r-s{ margin-right:10%!important; }
.margin2-r-m{ margin-right:20%!important; }
.margin2-r-l{ margin-right:25%!important; }
.margin2-r-xl{ margin-right:30%!important; }

.margin2-l-xs{ margin-left:5%!important; }
.margin2-l-s{ margin-left:10%!important; }
.margin2-l-m{ margin-left:20%!important; }
.margin2-l-l{ margin-left:25%!important; }
.margin2-l-xl{ margin-left:30%!important; }

@media screen and (max-width : 479px){
	.margin2-lr-xs,
	.margin2-lr-s,
	.margin2-lr-m,
	.margin2-lr-l,
	.margin2-lr-xl,
	.margin2-r-xs,
	.margin2-r-s,
	.margin2-r-m,
	.margin2-r-l,
	.margin2-r-xl,
	.margin2-l-xs,
	.margin2-l-s,
	.margin2-l-m,
	.margin2-l-l,
	.margin2-l-xl{ margin-left:0!important; margin-right:0 !important;}
}

/* ****************************************************
  Fixed固定ナビゲーション【fixed-nav】
***************************************************** */

.fixed-nav{
    display: none;
    opacity: 0;
    position: fixed;
    top: 0;
}

/* ****************************************************
  ページトップ【pagetop】
***************************************************** */

#pagetop{
	position: absolute;
	top:0;
}

.pagetop{
	display:block;
	opacity:0;
	position:fixed;
	
	/*詳細設定*/
	width:40px; height:40px;
	right:33px; bottom:100px;
}

@media screen and (max-width : 479px){
	.pagetop{
		margin: auto -25px -3px auto;
	}
}

/* ****************************************************
  レスポンシブ表示非表示【none】
***************************************************** */

.visible-pc{ display: inline !important; }
.visible-tb{ display:none !important; }
.visible-sp{ display:none !important;}

.none-pc{ display:none !important; }
.none-tb{ display:inline !important; }
.none-sp{ display:inline !important; }

@media screen and (max-width : 767px){
	.visible-pc{ display:none !important; }
	.visible-tb{ display:block !important; }
	.visible-sp{ display:none !important;}
	
	.none-pc{ display:block !important; }
	.none-tb{ display:none !important; }
	.none-sp{ display:block !important; }
}

@media screen and (max-width : 479px){
	.visible-pc{ display:none !important; }
	.visible-tb{ display:none !important; }
	.visible-sp{ display:block !important;}
	
	.none-pc{ display:block !important; }
	.none-tb{ display:block !important; }
	.none-sp{ display:none !important; }
}

/* ****************************************************
  レスポンシブ画像【responsive-img】
***************************************************** */

img.responsive-img{
	width:100%;
	height:auto;
}


/* ****************************************************
  float解除【Clear fix】
***************************************************** */

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

.clearfix {
	min-height: 1px;
}

* html .clearfix {/* for IE6 */
	height: 1px;
}

*:first-child+html .clearfix {/* for IE7 */
	zoom: 1;
}


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

	トランジョン
	
#####################################################################
*/

/* ****************************************************
  一括指定【easeOutExpo】
***************************************************** */

.Navigation li,
.n_popup-menu{
	-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
}

.link,
.link-animeline01 span{
	-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
}

.button,
.button::before{
	-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
}

.flex-direction-nav a,
.flex-control-paging li a{
	-webkit-transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
	transition: all 600ms cubic-bezier(0.19, 1, 0.22, 1);
}