@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.7.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */

/*---------------------*/
/*	追記css
/*---------------------*/
/* #header {
	overflow: hidden;
} */
/* twitter instagram着色用 */
div#snsWrap a:visited {
  /* color: #00489a; */
  text-decoration: none;
}
a:link {
    /* color: #00489a; */
    text-decoration: none;
}
li {
	list-style: none;
}
a.detail-link {
	color: #fff;
	position: relative;
	transition: all .3s;
}
a.detail-link:hover:after {
	color: #272727;
}
img.warranty-margin {
	margin-top: 1em !important;
}
/* #Nav */

#Nav .navLabelLink:link {
	text-decoration: none;
}
.atcare-page .content-image.has-animation.load-animation.at-care-logo {
	margin-bottom: 15px;
}
/* @media only screen and (min-width:768px){
	.text-padding {
		padding-right: 30px;
	}
} */
span.span-space {
	display: block;
	height: 10px;
}
span.span-title-space {
	display: block;
	height: 4px;
}
.content-text a {
	color: #fff;
}
a.under-line {
	text-decoration: underline !important;
	color: #fff;
}
/*
@media only screen and (min-width:768px){
	p.foot-pc-block {
		display: block;
	}
	p.foot-sp-block {
		display: none;
	}
}
@media only screen and (max-width:768px){
	p.foot-pc-block {
		display: block;
	}
	p.foot-sp-block {
		display: none;
	}
}
@media only screen and (max-width: 639px) and (min-width: 480px) {
	p.foot-pc-block {
		display: none;
	}
	p.foot-sp-block {
		display: block;
	}
}
@media only screen and (max-width:479px) {
	p.foot-pc-block {
		display: none;
	}
	p.foot-sp-block {
		display: block;
	}
}
*/
h4.mask-title {
	display: block;
    margin-top: 1em;
	font-weight: 600;
    font-size: 1.2em;
    letter-spacing: -0.01em;
	white-space: nowrap;
	}
/*===============================================================*/
/*
	COMMON
*/
/*===============================================================*/

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


.sp_block {
	display: none;
}
.pc_block {
	display: block;
}
.tb_block {
	display: none;
}
.x_block {
	display: none;
}

.ie_visible {
	display: none;
}

.ie .ie_visible {
	display: block;
}

.ie .ie_hide {
	display: none;
}
@media only screen and (max-width:800px){
	.tb_block {
		display: none;
	}
}
@media only screen and (max-width:450px){
	.x_block {
		display: block;
	}
}

.pressPDF object {
	height: 1160px;
    overflow-y: hidden;
    position: relative;
}

/*---------------------*/
/*	Layout box
/*---------------------*/

#Container {
	margin: 0 auto;
	position: relative;
}

.wrapper {
	width: 100%;
}


/*---------------------*/
/*	image
/*---------------------*/

img {
	vertical-align: top;
}



/*============================================================================================
トップページ　start
index.html
============================================================================================*/

/*---------------------*/
/*	#Header
/*---------------------*/

#HeaderWrap {
	height: auto;
}

#Header {
	width: 100%;
	margin: 0 auto;
	/*padding-top: 24px;*/
}

#LogoWrap {
	/*margin-bottom: 12px;*/
	width: 100%;
	min-width: 960px;
	height: auto;
	/*background: url(../img/logo_back.gif) repeat-x center;*/
}

#LogoArea {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

#snsWrap{
	position: absolute;
	top: 25px;
    /*top: -27px;*/
    right: 495px;}

#Logo {
	margin: 0 auto;
	width: 100%;
	height: auto;
}

#Logo img {
	width: 148px;
	height: auto;
}

#LogoSide {
	position: absolute;
	top: 40px;
    left: 160px;
	/*top: -13px;
	right: 130px;*/
	/* color: #00489a; */
	letter-spacing:
	0.1em;
}

@media only screen and (max-width:1000px){
	#LogoSide {
		letter-spacing: -0.15em;
	}
}

/*---------------------*/
/*	#Nav
/*---------------------*/

#NavWrap {
}

#Nav {
	position: relative;
	margin: 0;
	z-index: 3000;
}

#MainNav {
	display: block;
}

#Nav li.navLabel {
	height: 45px;
	float: left;
	border-right: 1px solid #CCC;
	font-size: 100%;
}

#Nav li.navLabel:last-child {
	border-right: none;
}

#Nav .navLabel .navLabelLink {
	display: block;
	height: 45px;
	padding: 5px 0;
	text-align: center;
	/* letter-spacing: 1.5px; */
}

.navLabel .navLabelLink span {
	display: block;
	width: 100%;
	line-height: 1.1;
	font-size: 16px;
	letter-spacing: 0.1em;
	color: #696a6b;
}

#Nav .navLabel .navLabelLink small {
	color: #999;
	font-size: 10px;
}

/* current-page statement */

#Nav .navLabel.current .navLabelLink {
	background: rgba( 102, 102, 102, 0.9);
	color: #FFF !important;
}

#Nav .navLabel.current .navLabelLink small {
	color: #FFF !important;
}

.ie6 #Nav .navLabel.current .navLabelLink,
.ie7 #Nav .navLabel.current .navLabelLink,
.ie8 #Nav .navLabel.current .navLabelLink {
	/*
	background: url(../img/common/bg_activenav.png) repeat; */
}



/* hover statement */

#Nav .navLabel.active .navLabelLink {
	background: rgba( 102, 102, 102, 0.9);
	color: #FFF !important;
}

#Nav #NavProduct.active .navLabelLink {
	height: 38px;
}

.ie6 #Nav .navLabel.active .navLabelLink,
.ie7 #Nav .navLabel.active .navLabelLink,
.ie8 #Nav .navLabel.active .navLabelLink {
	/*
	background: url(../img/common/bg_activenav.png) repeat; */
}

#Nav .navLabel.active .navLabelLink .typo_en { color: #fff; }

#Nav .navLabel.active .navLabelLink small {
	color: #FFF;
}

#Nav .navLabel .navChild {
	position: absolute;
	margin: 0 auto;
	padding: 10px;
	background: rgba( 102, 102, 102, 0.9);

	z-index: 12345;
}

.ie6 #Nav .navLabel .navChild,
.ie7 #Nav .navLabel .navChild,
.ie8 #Nav .navLabel .navChild {
	/*
	background: url(../img/common/bg_activenav.png) repeat; */
}



#Nav .navChild {
	display: none;
}

#Nav .navChild > li {
	float: left;
	padding: 10px 36px 5px 20px;
	text-align: left;
}

#Nav .navChild > li:last-child {
	float: left;
	padding: 10px 20px 10px 20px;
}

#Nav .navChild > li > a {
	display: block;
	padding: 2px 0 0;
	border-top: none;
	font-size: 133.3%;
	letter-spacing: 1.5px;
	line-height: 1.4;
	color: #FFF;
}

#Nav #NavCustomer .navChild > li > a {
	font-size: 12px;
}

#Nav .navGrandchild > li a {
	color: #FFF;
	line-height: 1.4;
	letter-spacing: 1.5px;
}

#Nav .navGrandchild > li:before {
	content: "-";
	color: #FFF;
	padding-right: 2px;
}

.youtube {
    position: absolute;
    top: 11px;
    left: 465px;
    width: 20px;
    height: 20px;
}

.navLabelLink {
	display: block;
}
#NavProduct .navLabelLink {
	/*width: 160px;*/
	width: 130px;
}/*194*/
#NavCustomer .navLabelLink { width: 172px;}/*214*/
#NavPress .navLabelLink { width: 130px;}/*179*/
#NavHistory .navLabelLink { width: 255px;}/*220*/
#NavShoplist .navLabelLink { width: 135px;}
#NavOnline .navLabelLink {width: 140px;}

#NavProduct .navChild { width: auto;}
#NavHistory .navChild { width: auto;}
#NavShoplist .navChild { width: auto;}
#NavCustomer .navChild { width: auto;}
#NavPress .navChild { width: auto;}

.current .navLabelLink .typo_en { color: #fff; }

/*---------------------*/
/*	#Content
/*---------------------*/

/* パンくずリスト */

#BreadCrumb {
	margin: 5px 0 10px;
}

#BreadCrumb li {
	display: inline;
}

#BreadCrumb li:after {
	content: ">";
	padding-left: 10px;
	margin-right: 10px;
}

#BreadCrumb li.current:after {
	content: "";
	padding: 0;
	margin: 0;
}

/*---------------------*/
/*	#Footer
/*---------------------*/


#FooterWrap {
	width: 100%;
	position: absolute;
	left: 0;
	margin: 50px auto 0;
	border-top: 1px solid #b3b8bf;
	background: url(../img/atcare/bg_footer.png) repeat-x top;
}


#Footer {
	max-width: 100%;
	margin: 0 auto;
	/*
	padding: 10px 0; */
	position: relative;
}

#FootLeft {
	float: left;
	padding-left: 30px;
}

#FootLink li {
	display: inline;
	margin-right: 2em;
	font-size: 74.7%;
}

#FootLink li:before {
	content: "≫";
	padding-right: 0.5em;
}


#FootLink li:last-child {
	margin-right: 0;
}

#FootLeft p {
	margin-top: 8px;
}

#FooterRight {
	float: right;
	margin-top: 30px;
	margin-right: 30px;
	text-align: right;
	position: relative;
}

#FooterRight p {
	margin-top: 3px;
}
/* #FooterRight #Copyright {
	margin-top: 12px;
	font-size: 83.3%;
} */


/* #Copyright small {
	font-size: 100%;
} */


/*----フッター　ブランドアイコン---------------*/

#brand_icon_box{
	width: 100%;
    height: 45px;
	margin: 20px auto 10px;
}
/*#brand_icon_box {	margin-top: 5px; }*/
#brand_icon_box span{
    margin-left: 20px;
    float: left;
}
#brand_icon_box img{
	width: 100%;
	height: auto;
}
/* サムソナイトマークの設定 */
#brand_icon_box .sco_small_icon {
	margin-left: 0px;
	width: 100px;
    height: auto;}
/* デュモンクスマークの設定 */
#brand_icon_box .dmx_small_icon {
	width: 100px;
    height: auto;}
/* REDマークの設定 */
#brand_icon_box .red_small_icon {
	width: 100px;
    height: auto;}
/* リポーマークの設定 */
#brand_icon_box .lipault_small_icon {
	width: 100px;
    height: auto;}
/* カメレオンマークの設定 */
#brand_icon_box .kamiliant_small_icon {
	margin-left: 0px!important;
    width: 100px;
    height: auto;
	position: relative;
	left: 15px;}
/* JSトランクの設定 */
#brand_icon_box .js_small_icon {
	margin-left: 0px;
	width: 100px;
    height: auto;
}

#FootLink li.facebook:before{
	content: none;
    padding-right: 0em;
}
#kokuzi {display: none;}
#kokuzi img {
	width: 175px;/*200px*/
	height: auto;
}
/* #Copyright small {font-size: 100%;} */


/*.facebook {
	position: absolute;
	top: 10px;
	left: 455px;
}*/
.facebook {
	position: absolute;
	top: 10px;
	left: 373px;
	width: 20px!important;
}
.facebook img,
.youtube img{width: 20px!important;}

.instagram {
	position: absolute;
	top: 10px;
	left: 405px;
	width: 20px;
    height: 20px;
}
.twitter {
	position: absolute;
	top: 11px;
	left: 435px;
	width: 20px;
    height: 20px;
}
.instagram a i,
.twitter a i{font-size: 22px;}


/*---------------------*/
/*	#Content Common
/*---------------------*/

#Content {
	width: 960px;
	margin: 0 auto;
}

#Main {
	float: left;
	width: 630px;
}

#Index #Main {
	width: 630px;
}

#Side {
	float: right;
	width: 300px;
}


/*===============================================================*/
/*
	PIE template
*/
/*===============================================================*/


.ie #Foo {
	position: relative;
	behavior: url("/foo/PIE.htc");
}

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

	size-m.css copy

****************************/
/*
@media only screen and (min-width:1000px){
	#FooterRight {
			float: right;
			margin-top: 30px;
			margin-right: 30px;
			text-align: right;
	}

}
*/
@media only screen and (max-width:1000px){
	#FooterRight {
		float: none!important;
		margin-top: 0!important;
		margin-right: 15px!important;
		text-align: right!important;
	}
}
/* old 979px
@media only screen and (max-width:1000px){
	#NavProduct .navLabelLink { width: 160px;}
	#NavHistory .navLabelLink { width: 195px;}
	#NavShoplist .navLabelLink { width: 148px;}
	#NavCustomer .navLabelLink {
		padding-top: 0px;
		width: 130px;}
	#NavPress .navLabelLink { width: 140px;}
	#NavOnline .navLabelLink { width: 120px;}
}
*/
/*===============================================================*/
/*
	pc only
*/
/*===============================================================*/

/*@media only screen and (min-width:960px) {*/
@media only screen and (min-width:1001px) {

	/*============================================================================================
	トップページ　start
	index.html
	screen only max-width:979px settings
	============================================================================================*/

	#MainNav {
		width: 100%;/*700px*/
		margin: 0 auto;
		display: block !important;
	}

	/*============================================================================================
	トップページ　end
	index.html
	screen only max-width:979px settings
	============================================================================================*/

}


/*===============================================================*/
/*
	for tb
*/
/*===============================================================*/
/*@media only screen and (max-width:959px){*/
@media only screen and (max-width:1000px){

		#MainVisual {
			background: none;
			height: auto;
		}

		#MainVisual img {
			display: inline;
		}

		#Index #Content {
			padding-top: 15px;
		}

		#Main {
			padding-bottom: 30px;
			border-bottom: 1px dotted #e3e6e9;
		}

		.top_main_banner {
			padding: 30px 0 0;
		}

		.top_main_banner li {
			padding: 0 0 0 10px;
		}


		#Side {
			padding-top: 30px;
		}

		#SideBanner li {
			float: left;
			margin-left: 10px;
		}

		#SideBanner li:first-child {
			margin-left: 0;
		}

		#SideBanner ul > li:first-child + * + * {
			margin-left: 0;
		}
		#SideBanner2 {
			width: 150px;
			height: auto;
			margin: 0 auto;
			margin-bottom: 30px;
		}
		/*==========================================================
		トップページ　start
		index.html
		media only screen and (min-width:640px) and (max-width:959px)
		========================================================*/
		#LogoSide {
				position: absolute;
			top: 67px;}

		.pressPDF object { height: auto;}


		/*---------------------*/
		/*	image
		/*---------------------*/

		img {
			max-width: 100%;
			height: auto;
		}

		#snsWrap span.facebook a img{
			max-width: inherit;}

		/*---------------------*/
		/*	spacer classes
		/*---------------------*/

		.tb_block {
			display: block;
		}


		/*---------------------*/
		/*	Layout box
		/*---------------------*/


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

		#Container {
		}

		/*---------------------*/
		/*	#Header
		/*---------------------*/

		#HeaderWrap {
		}

		#Header {
			width: 100%;
			margin: 0 auto;
		}

		#LogoWrap { min-width: 100%; }

		#LogoArea {
			/*width: 640px;*/
			width: 90%;
			height: auto;
			/*padding: 25px 15px 20px;*/
			max-width: 90%;/*640px*/
			min-width: 640px;
		}

		.bx-wrapper{ min-width: 640px; }
		#MainVisualWrap { min-width: 640px; }

		#LogoArea h1 {
		}

		#LogoSide {top: 43px;}

		/*---------------------*/
		/*	#Nav
		/*---------------------*/

		#Nav {
			/*
			min-width: 640px;
			width: 680px; */
			min-width: 100%;
			width: 100%;
			/*
			margin: 0 auto 5px; */
			margin: 0 auto;
		}

		#MainNav {
			width: 100%;/*600px*/
			margin: 0 auto;
			padding: 0;
			display: none;}


		#Nav li.navLabel {
			font-size: 90%;
			/*font-size: 100%;*/
			}


		#Nav h1.open {
			background: url(../img/atcare/ico_nav_close.png) no-repeat center;
		}

		#Nav h1 {
			display: block;
			/* float: right; */
			/* width: 40px; */
			height: 40px;
			/* margin: -33px 0 0 calc(100vw - 60px); */
			margin: -40px 0 0 86%;
			background: url(../img/atcare/ico_nav.png) no-repeat center;
			text-indent: 100%;
			white-space: nowrap;
			overflow: hidden;
			cursor: pointer;
			/*
			position: absolute;
			top: -40px;
			right: 0; */
		}


		#Nav .navLabel .navLabelLink {letter-spacing: 0;}

		#Nav .navLabel .navLabelLink span {
			line-height: 1.2;
			font-size: 116.7%;
		}

		#Nav .navChild > li > a {
			font-size: 116.7%;
			letter-spacing: 0;
		}

		#NavProduct .navLabelLink { width: 114px;}
		#NavHistory .navLabelLink { width: 150px;}
		#NavShoplist .navLabelLink { width: 78px;}
		#NavCustomer .navLabelLink { width: 134px;}
		#NavPress .navLabelLink { width: 80px;}
		#NavOnline .navLabelLink { width: 119px;}

		#NavProduct .navChild { width: auto;}
		#NavHistory .navChild { width: auto;}
		#NavShoplist .navChild { width: auto;}
		#NavCustomer .navChild { width: auto;}
		#NavPress .navChild { width: auto;}

		/*---------------------*/
		/*	#Content
		/*---------------------*/

		#ContentWrap {
			max-width: 640px;
			margin: 0 auto;
		}

		#Content {
			width: 615px;
			margin: 0 15px;
		}

		#BreadCrumb {
			display: none;
		}

		#Index #Main {
				float: none;
				width: 100%;
		}

		#Main {
				float: none;
				width: 100%;
		}


		#Side {
			clear: both;
				float: none;
				width: 100%;
			border-left: none;
			border-right: none;
			border-bottom: none;
		}

		/*---------------------*/
		/*	#Footer
		/*---------------------*/


			#FooterWrap {
				/* min-width: 640px; */
				margin: 30px auto 0;
				border-top: 1px solid #b3b8bf;
				background: url(../img/atcare/bg_footer.png) repeat-x;
			}

			#tb_topBtn {
				display: block;
				position: absolute;
				bottom: 152px;
				right: 0;
			}

			#History #tb_topBtn {
				display: block;
				position: absolute;
				bottom: 125px;
				right: 0;
			}


			#Footer {
				max-width: none;
				/*width: 640px;640*/
				margin: 0 auto;
				padding: 10px 0;
			}
			#FootLink li {
				display: inline;
				margin-right: 2em;
				font-size: 80%;
			}

			#FootLink li:before {
				content: "≫";
				padding-right: 0.5em;
			}

			#FootLink li.facebook:before {
				content: "";
			}

			#FootLink li.instagram:before {
				content: "";
			}

			#FootLink li:last-child {
				margin-right: 0;
			}
			#FootLeft {
				float: none;
				position: relative;
				width: 100%;
				padding-left: 0px;/*15*/
			}
			#FootLeft p {
				position: absolute;
				top: 60px;
				margin-top: 0;
			}
			#FooterRight {margin-left: 0px;margin-right: 0px!important;}

			/*　フッターブランドアイコン */
			#brand_icon_box{
				display: flex;
				height: 45px;
				margin: 20px 0 20px;
			}
			#brand_icon_box span {
					margin-left: 15px;
					float: left;
			}
			#brand_icon_box .sco_small_icon,
			#brand_icon_box .js_small_icon{
					margin-left: 0;
			}

			.facebook {
				top: 10px;
			}
			/*　酷似サイト注意 */
			#kokuzi{
				float: right;
				}

			/*　Copyright */
			#Copyright {
				/* float: left; */
				margin-top: 12px;
				/* font-size: 83.3%; */
			}
			/*
			#Copyright small {
				font-size: 100%;
			}
			*/
			#History #brand_icon_box .dm_small_icon,
			#History #brand_icon_box .sco_small_icon,
			#History #brand_icon_box .red_small_icon,
			#History #brand_icon_box .kamiliant_small_icon {
				top: 44px;
			}

			/* footer ul !important */
			footer ul#footLink {
				display: flex;
				flex-wrap: wrap;
				width: 50%;
			}


			/*.facebook, .instagram {
				top: 0;
			}*/


			div.footBnrBox {
				width: 640px;
			}


		/*============================================================================================
		トップページ　end
		index.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/


		/*============================================================================================
		子ページ　共通　start
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		#topBtn {
			display: none;
		}

		#ttlBox h2 {
			margin: 0 auto;
			width: 640px;
			height: auto;
		}

		#categoryTtlBox { min-width: 100%; }

		#categoryTtlBox h2 {
			width: 595px;
		}

		.productTopBorder {
			width: 615px;
		}


		/* footer */
		.prodFootBorder {width: 615px;}

		#footBnrSpace {
		max-width: 640px;
		min-width: 640px;
		}

		#productBnrSco {
			margin-left: 15px;
		}
		#productBnrSlist {
			margin-left: 15px;
		}
		#productBnrBox {
			width: 640px;
			clear: both;
			margin-left: 15px;
			float: none;
		}

		div.productBnrSco {
			width: 300px;
			height: auto;
			float: left;
			margin-top: 0;
		}

		div.productBnrRed {
			margin-left: 10px;
		}

		div#productBnrAt {
			margin-top: 0;
			margin-left: 15px;
			width: 300px;
			height: auto;
			float: left;
		}

		div.productBnrDm {
			margin-top: 20px;
			margin-left: 0;
			float: left;
		}

		div.productBnrLipault {
			margin-left: 10px;
		}


		div.productBnrKamiliant {
			margin-top: 20px;
			margin-left: 0;
			float: left;
		}

		div#productBnrJsTrunk {
			margin-top: 15px;
			margin-left: 15px;
		}
		/*============================================================================================
		子ページ　共通　end
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/


		/*============================================================================================
		プレスページ　start
		press.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/

		#pressContainer {
			width: 595px;
		}
		.pcMaxW{max-width:none;margin:0 auto;}
		/*============================================================================================
		プレスページ　end
		press.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/


		/*============================================================================================
		カスタマーサービス　start
		customer.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		#customerNav {
			margin: 0 auto;
			width: 460px;
		}

		#customerNav li {
			margin-bottom: 40px;
		}

		#customerNav .faqBtn {
			margin-left: 0;
		}

		#customerContainer {
			width: 615px;
			margin-top: 50px;
		}

		div.notesBtn {
			margin-top: 0;
		}


		/* タブナビゲーション */
		nav#customerTab {
			margin: 40px auto 40px;
			width: 100%;
			height: 23px;
			max-width: 100%;
			display: block;
			border-bottom: 1px solid #ccc;
		}
		nav#customerTab ul {
			margin: 0 auto;
			width: 74%;
			height: 23px;
			border-bottom: 1px solid #ccc;
		}
		nav#customerTab li {
			display: inline;
			float: left;
			width: 100px;
			height: 22px;
			border: 1px solid #ccc;
			margin-right: 0;
			font-size: 12px;
			line-height: 24px;
			text-align: center;
		}

		nav#customerTab li:first-child {
			margin-left: 0;
		}

		nav#customerTab li a {
			width: 100%;
			height: 22px;
			display: block;
		}
		nav#customerTab li.customerTabOn {
			border-bottom: 1px solid #fff;
		}


		#customerNav {
			width: 300px;
			margin: 0 auto;
		}

		#customerNav ul li {
			width: 140px;
			height: auto;
			margin-bottom: 40px;
			margin-left: 20px;
			float: left;
		}

		#customerNav ul li.faqBtn {
			margin-left: 0;
		}

		div.notesBtn {
			width: 290px;
			margin-top: 0;
		}



		/*============================================================================================
		カスタマーサービス　end
		customer.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		#faqContainer {
			width: 615px;
		}

		#faqSummary {
			width: 615px;
		}

		#contactSec {
			width: 615px;
		}



		/*============================================================================================
		会社概要　start
		company.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		#comTableContainer {
			width: 610px;
		}

		/*============================================================================================
		会社概要　end
		company.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/


		/*============================================================================================
		商品一覧＋商品詳細ページ　共通メガメニュー　start
		company.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		#Product #Content {
			width: 640px;
		}

		#brandMenu {
			height: auto;
			margin-left: auto;
			margin-right: auto;
			position: relative;
		}

		#brandMenu ul.brandNavi {
			width: 640px;
			margin-left: 0;
			position: relative;
			top: 0;
			left: 0;
		}

		#brandMenu li.menuArea01 ul#menuHide {
			/*width: 600px;
			margin-left: -10px;*/
			width: 279px;
			display: block;
		}

		#brandMenu li.menuArea02 ul#menuHide {
			width: 279px;
			/*width: 600px;*/
			/*margin-left: -220px;*/
			display: block;
		}

		#brandMenu li.menuArea03 ul#menuHide {
			/*width: 600px;
			margin-left: -430px;*/
			width: 279px;
			display: block;
		}

		#brandMenu li#menuChild01,
		#brandMenu li#menuChild02 {
			width: 100%;
			float: none;
		}

		#brandMenu li#menuChild01 ul li,
		#brandMenu li#menuChild02 ul li {
			width: 180px;
			float: left;
		}

		#brandMenu li#menuChild02 {
			margin-top: 20px;
		}

		/*============================================================================================
		商品一覧＋商品詳細ページ　共通メガメニュー　end
		company.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/

		#travelCollectionBox .travelCollection2,
		#travelCollectionBox .travelCollection4,
		#travelCollectionBox .travelCollection6,
		#travelCollectionBox .travelCollection8,
		#travelCollectionBox .travelCollection10,
		#travelCollectionBox .travelCollection12 {
			margin-right: 0px;
		}

		#travelCollectionBox .travelCollection3,
		#travelCollectionBox .travelCollection9 {
			margin-right: 30px;
		}


		/*============================================================================================
		商品詳細ページ　start
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/
		/* viewer */
		#detailViewer {
			position: relative;
		}

		#tabDetailDescBox {
			margin-top: 50px;
			width: 640px;
			height: auto;
			position: relative;
		}

		#detailViewer {
			margin-left: 15px;
			float: left;
		}

		#detailMainImage {
			width: 640px;
			height: auto;;
		}

		#detailDescBox {
			width: 300px;
			margin-top: 0;
			float: right;
		}

		#detailName {
			padding-top: 0;
			padding-bottom: 5px;
			width: 300px;
			height: auto;
			text-align: left;
			border-bottom: 1px dotted #ccc;
		}

		#detailCom {
			margin-top: 10px;
			padding-top: 0px;
			padding-left: 0px;
			width: 300px;
			height: auto;
			border-left: none;
		}

		#detailColVariBox {
			width: 610px;
			height: auto;
		}

		.detailColVari {
			margin-left: 10px;
		}

		#detailColVari04 {
			margin-left: 10px;
		}

		#detailColVari03,
		#detailColVari04,
		#detailColVari05,
		#detailColVari06 {
			margin-top: 10px;
		}

		#detailColVari01,
		#detailColVari03,
		#detailColVari05 {
			margin-left: 0;
		}

		/*============================================================================================
		商品詳細ページ　end
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/

		/*============================================================================================
		修理について start
		repair.html
		============================================================================================*/
		#partsImgBox {
			margin: 0 auto;
			width: 550px;
		}

		#parts02 { float: right; }

		#parts03,#parts04 { margin-top: 40px; }

		#parts02,#parts04 {
			margin-left: 40px;
		}

		.partsRepairBox {
			width: 300px;
		}

		#partsLeftBox {
			width: 100px;
			height: auto;
			float: left;
		}

		#partsRightBox {
			width: 200px;
			float: right;
		}

		#parts06, #parts08, #parts10, #parts12, #parts14, #parts16 {
			float: right;
			margin-left: 0px;
		}
		/*============================================================================================
		修理について end
		repair.html
		============================================================================================*/

		/*============================================================================================
		保証について start
		guarantee.html
		media only screen and (max-width:639px)
		============================================================================================*/

		#guaranteeSec {
			width: 100%;
		}
		/*============================================================================================
		保証について end
		guarantee.html
		media only screen and (max-width:639px)
		============================================================================================*/


		/*============================================================================================
		サムソナイトの歴史 start
		history.html
		media only screen and (min-width:640px) and (max-width:959px)
		============================================================================================*/

		#historyContainer {
			width: 560px;
		}

		#historySec {
			width: 560px;
		}

		#timelineContainer {
			width: 560px;
		}

		#concept .timelineEvent {
			padding-right: 20px;
		}

		p.hisotryL {
			width: 520px;
		}

		div#historyR {
			display: none;
		}

		span.tbImg {
			padding-left: 20px;
			display: inline;
			float: right;
		}

		span.h2000UnderImg {
			width: 560px;
			text-align: left;
			display: block;
		}

		span.h2000UnderImg img {
			width: 250px;
			height: auto;
			vertical-align: bottom;
		}

		.tbImg2 {
			display: inline;
			padding-left: 20px;
		}

		#concept .timelineEvent h3{
			width: 500px;
		}
		#concept .timelineEvent p {
			width: 500px;
		}

		#h01 .timelineEvent {
			height: auto;
		}

		.timelineEvent p {
			width: 500px;
		}



		/*======================================
		サムソナイトの歴史 end
		history.html
		media only screen and (min-width:640px) and (max-width:959px)
		======================================*/
}

/* old 710px */
@media only screen and (max-width: 1000px) {

			#FootLink li.facebook {
					position: absolute;
					top: 0px;
					left: 425px;
				width: 20px;
					margin-top: 0;
					padding-right: 0;
			}

			#brand_icon_box span {
			 /*   max-width: 200px!important;
					min-width: 80px!important;
					width: 23%!important;*/
				/*margin-left: 0px;*/
				/*margin-left: 15%;*/
					height: auto;
			}

			/* footer バナー 左*/
			.sco_small_icon,
			.kamiliant_small_icon{
				/*margin-left: 0px!important;
				margin-right: 15%!important;*/
				}
			/* footerバナー 中央*/

			 /*{
				margin: 0!important;
				}*/

			/* footerバナー 右*/
			#brand_icon_box.lipault_small_icon,
			#brand_icon_box.js_small_icon{
				float: right;
				margin-left: 15%!important;
				margin-right: 0px;
			}

			/*上部は下マージン*/
			.at_small_icon,.dmx_small_icon,.red_small_icon{
				margin-bottom: 4%!important;
				}

			/*#FooterRight {margin: 20px 30px 0;}	*/
}

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

/* @media only screen and (max-width: 680px) { */
@media only screen and (max-width: 1000px) {

			#Nav li.navLabel {font-size: 75%;}

			#NavProduct .navLabelLink { width: 110px;}
			#NavHistory .navLabelLink { width: 143px;}
			#NavShoplist .navLabelLink { width: 75px;}
			#NavCustomer .navLabelLink { width: 130px;}
			#NavPress .navLabelLink { width: 77px;}
			#NavOnline .navLabelLink { width: 115px;}

}
/*===============================================================*/


/*@media only screen and (max-width:639px) {*/
@media only screen and (max-width:1000px) {

			#MainVisual {
				background: none;
				height: auto;
			}

			#MainVisual img {
				display: inline;
			}

			#Index #Content {
				padding: 20px 10px 0;
			}
			#tabDetailDescBox {
				margin-top: 0px;
				width: 320px;
			}
			#detailDescBox {
					width: 320px;
			}
			#detailColVariBox {
					width: 320px;
					height: auto;
			}
			div.productBnrLipault {
					margin-left: 0px;
					margin-top: 20px;
			}
			.top_news h1 {
				padding-bottom: 5px;
				border-bottom: 1px solid #CCC;
				font-size: 133.3%;
				letter-spacing: 1.5px;
			}

			.top_news ul {
				padding: 15px 0 5px;
				border-bottom: 1px solid #CCC;
			}

			.top_news ul li {
				padding: 0 0 10px;
			}

			.top_news ul li dd {
				display: block;
				overflow: hidden;
			}


			.top_main_banner {
				padding: 20px 0 0;
				text-align: center;
			}

			.top_main_banner li {
				float: none;
				padding: 0;
			}

			.top_main_banner li:first-child {
				padding: 0 0 10px;
			}

			#SideBanner li {
				text-align: center;
				margin-bottom: 10px;
			}

			#SideBanner2 {
				width: 150px;
				height: auto;
				text-align: center;
				margin-bottom: 10px;
			}

			/* AT+DMバナー */
			#sideBrandBox {
				position: static;
				margin: 0 auto;
				width: 300px;
			}

			li#sideDm {	float: none; }
			li#sideSco { margin-top: 20px; float: none; }
			li#sideRed { float: none; }
			li#sideKamiliant { float: none; }

			/* footer iconバナー */
			/*
			.red_small_icon img { width: 40px; }
			.kamiliant_small_icon img { width: 40px; }
			.js_small_icon img { width: 58px; }
			*/


			/*================================================
			トップページ　start
			index.html
			====================================================*/
			.pc_block {display: none;}

			.pressPDF object { height: auto;}

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

			img {
				height: auto;
			}

			.sp_hide {
				display: none;
			}

			.sp_block {
				display: block;
			}

			/*---------------------*/
			/*	#Header
			/*---------------------*/

			#HeaderWrap {
				height: auto;
				background: none;
			}

			#Header {
				position: relative;
				min-height: 80px;
				min-width: 320px;
			}

			#LogoWrap {
				min-width: 100%;
				/*background: url(../img/sp_logo_back.jpg) repeat-x left center;*/
			}

			#LogoArea {
				width: 90%;
				max-width: 90%;
				min-width: 90%;
				/*margin-bottom: 24px;*/
				padding: 0;
				/*background: url(../img/common/bg_header.png) repeat-x bottom;*/
			}

			#Logo img {
				 width: 110px;
				/*width: 90px;*/
			}

			#LogoSide {
				/*display: none;*/
				width: 80%;
				font-size: 10px;
				top: 80px;
				left: 10px;
					/*right: 70px;*/
			}


			#snsWrap {
					/*right: 435px;
					top: -20px;*/
				right: 480px;
					top: 0px;
			}

			/*---------------------*/
			/*	#Nav
			/*---------------------*/

			#NavWrap {
			}



			#Nav li.navLabel {
				height: auto;
				float: none;
				border-right: none;
				font-size: 100%;
			}

			#Nav li.navLabel:last-child {
				border-right: none;
			}

			#Nav .navLabel .navLabelLink {
				display: block;
				height: auto;
				width: 100%;
				padding: 10px 10px 10px 25px;
				text-align: left;
				letter-spacing: 0;
				background: #666;
			}

			#Nav .navLabel .navLabelLink span {
				display: inline;
				width: 100%;
				line-height: 1.1;
				font-size: 133.3%;
				padding-right: 10px;
				color: #FFF;
			}

			#Nav .navLabel .navLabelLink small {
				color: #333;
				font-size: 83.3%;
			}

			#Nav #NavProduct.active .navLabelLink {
				height: auto;
			}

			/* hover statement */

			#Nav .navLabel.active .navLabelLink {
				height: auto;
				background: rgba( 102, 102, 102, 1);
				color: #FFF !important;
			}

			#Nav .navLabel .navLabelLink small {
				color: #FFF;
			}

			#Nav .navLabel.active .navChild {
				display: none;
				position: relative;
				margin: 0 auto;
				padding: 0 10px 10px 20px;
				background: rgba( 51, 51, 51, 1);
			}

			#Nav .navLabel .navChild {
				display: none;
				position: relative;
				margin: 0 auto;
				padding: 0 10px 10px 20px;
				background: rgba( 51, 51, 51, 1);
			}

			#Nav .navChild > li {
				float: none;
				text-align: left;
				padding: 0;
			}

			#Nav .navChild > li:last-child {
				float: none;
				padding: 0;
			}

			#Nav .navChild > li > a {
				display: block;
				padding: 5px 0 3px;
				font-size: 116.7%;
				color: #FFF;
			}
			#Nav .navGrandchild > li a {
				color: #FFF;
			}
			.navLabelLink {
				display: block;
			}

			#NavProduct .navLabelLink { width: 194px;}
			#NavHistory .navLabelLink { width: 220px;}
			#NavShoplist .navLabelLink { width: 148px;}
			#NavCustomer .navLabelLink { width: 214px;}
			#NavPress .navLabelLink { width: 179px;}

			#NavProduct .navChild { width: 430px;}
			#NavHistory .navChild { width: auto;}
			#NavShoplist .navChild { width: auto;}
			#NavCustomer .navChild { width: auto;}
			#NavPress .navChild { width: auto;}


			#NavProduct .navLabelLink { width: auto;}
			#NavHistory .navLabelLink { width: auto;}
			#NavShoplist .navLabelLink { width: auto;}
			#NavCustomer .navLabelLink { width: auto;}
			#NavPress .navLabelLink { width: auto;}

			#Nav li {
				width: auto;
				float: none;
			}

			#Nav a.navLabel span {
				display: block;
				width: 100%;
				height: 40px;
				padding-top: 6px;
				font-size: 100%;
				font-weight: bold;
				letter-spacing: 2px;

			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			}

			#Nav .navChild {
				line-height: 1.69;
				margin: 0 auto;
				width: auto;
			}

			#Nav .navChild li {
					font-size: 100%;
			}

			#Nav a.navLabel span {
				font-size: 100%;
			}

			#Nav .navChild li a {
				padding: 10px 0 8px;
				width: 100%;
			}

			/*---------------------*/
			/*	Content
			/*---------------------*/
			#ContentWrap {
				max-width: 100%;
				margin: 0 auto;
			}

			#Content {
				width: 300px;
				margin: 0 auto;
			}

			#Index #Main {
				float: none;
				width: auto;
				border-bottom: 1px dotted #E3E6E9;
				padding-bottom: 30px;
			}

			#Index #Side {
				float: none;
				width: auto;
				padding-top: 30px;
			}

			/*---------------------*/
			/*	#Footer
			/*---------------------*/


			#sp_topBtn {
				width: 30px;
				height: 30px;
				display: block;
				position: absolute;
				top: 0;
				right: 0;
				z-index: 100;
			}
			#sp_topBtn a {
				width: 100%;
				height: auto;
				display: block;
				position: absolute;
				top: 0;
				right: 0;
			}

			#Footer {
				max-width: none;
				margin: 0;
				padding: 10px 0;
			}

			#FootLeft {
				float: none;
				padding: 0 10px;
			}

			#FootLink li {
				display: block;
				float: left;
				padding: 5px 0;
			}

			/*#FootLink li:nth-child(2n-1) {
				clear: both;
			}*/

			#FootLink li:before {
				content: "≫";
				padding-right: 0.5em;
			}

			#FootLink li.facebook:before {
				content: "";
			}

			#FootLink li:last-child {
				margin-right: 0;
			}

			#FootLink li.facebook {
				width: 50%;
				margin-top: 5px;
				padding-right: 10px;
				text-align: right;

			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			}

			#FootLeft p {
				float: right;
				width: 50%;
				margin-top: 3px;
				-moz-box-sizing: border-box;
				-webkit-box-sizing: border-box;
				-o-box-sizing: border-box;
				-ms-box-sizing: border-box;
			}

			#FootLeft:after {
				content: ".";
				display: block;
				height: 0;
				clear: both;
				visibility: hidden;
				overflow:hidden;
				font-size:0.1em;
				line-height:0;
			}
			#FootLeft {display: inline-block;}

			/* Hides from IE-mac \*/
			html #FootLeft {height: 1%;}
			#FootLeft {display: block;}
			/* End hide from IE-mac */


			#FooterRight {
				float: none;
				margin: 15px 0 0;
				text-align: center;
			}

			#Copyright {
				/*
				font-size: 53.3%;
				overflow: hidden; */
				margin-top: 12px;
				/*
				width: 290px;
				text-align: center;
				*/
			}
			#Copyright {
				display: block;
				width: auto;
				margin: 0 auto;
				white-space: nowrap;
				overflow: hidden;
				font-size: 10px !important;
				transform: scale(0.9);
				transform-origin: 0 0;
				position: absolute;
				right: -30px;
				padding: 0 0 0 10px;
			}

			div.footBnrBox {
				width: 315px;
			}

			#footBnrSpace {
			max-width: 315px;
			min-width: 315px;
			}

			.bx-wrapper{ min-width: 320px; }
			#MainVisualWrap { min-width: 320px; }


			/*============================================================================================
			トップページ　end
			index.html
			============================================================================================*/

			/*============================================================================================
			子ページ　共通　start
			============================================================================================*/
			#topBtn {
				display: none;
			}

			#ttlBox h2 {
				margin: 0 auto;
				width: 320px;
				height: auto;
			}

			#categoryTtlBox { min-width: 100%; }

			#categoryTtlBox h2 {
				width: 300px;
			}

			p#pankuzu {
				display: none;
			}

			.productTopBorder {
				display: none;
			}

			#footBnrSpace {
				max-width: 320px;
			}

			#productBnrSco {
				margin-left: 10px;
				float: none;
			}

			div#productBnrAt {
				margin-top: 0;
				margin-left: 10px;
				width: 300px;
				height: auto;
				float: none;
			}

			#productBnrSlist {
				margin-top: 10px;
				margin-left: 10px;
				float: none;
			}



			#productBnrBox {
				margin: 0 auto;
				width: 300px;
				height: auto;
				float: none;
			}

			.productBnrSco {
				margin-top: 20px;
			}

			div.productBnrRed {
				margin-top: 20px;
				margin-left: 0;
			}

			div.productBnrDm {
				margin-top: 20px;
				margin-left: 0;
			}

			div.productBnrKamiliant {
				margin-top: 20px;
				margin-left: 0;
			}

			/* JS Trunk & Co.　バナー */
			#productBnrJsTrunk {
				width: 300px;
				height: auto;
				margin-top: 10px;
				margin-left: 10px;
				float: left;
			}

			#productBnrJsTrunk img {
				width: 100%;
				height: auto;
			}


			.prodFootBorder {
				width: 300px;
			}



			#pressContainer {
				width: 300px;
			}
			.pcMaxW{max-width:none;margin:0 auto;}

			#noteSpShow {
				display: block;
			}

			#noteSpHide {
				display: none;
			}

			/*============================================================================================
			子ページ　共通　end
			============================================================================================*/


			/*============================================================================================
			カスタマーサービス　start
			customer.html
			media only screen and (max-width:639px)
			============================================================================================*/
			#customerContainer {
				margin: 40px auto 0;
				width: 300px;
			}

			/* タブナビゲーション */
			nav#customerTab {
				margin: 40px auto 40px;
				width: 100%;
				height: 23px;
				max-width: 300px;
				display: block;
				border-bottom: 1px solid #ccc;
			}
			nav#customerTab ul {
				margin: 0 auto;
				width: 100%;
				max-width: 300px;
				height: 23px;
				border-bottom: 1px solid #ccc;
			}
			nav#customerTab li {
				display: inline;
				float: left;
				width: 50px;
				height: 22px;
				border: 1px solid #ccc;
				margin-right: 0;
				font-size: 12px;
				line-height: 24px;
				text-align: center;
			}

			nav#customerTab li:first-child {
				margin-left: 2.5%;
			}

			nav#customerTab li a {
				width: 100%;
				height: 22px;
				display: block;
			}
			nav#customerTab li.customerTabOn {
				border-bottom: 1px solid #fff;
			}


			#customerNav {
				width: 300px;
				margin: 0 auto;
			}

			#customerNav p span.spBr {
				display: block;
			}

			#customerNav ul li {
				width: 140px;
				height: auto;
				margin-bottom: 40px;
				margin-left: 20px;
				float: left;
			}

			#customerNav ul li.faqBtn {
				margin-left: 0;
			}

			nav#customerTab li#tabContact {
				width: 95px;
			}

			div.notesBtn {
				width: 290px;
				margin-top: 0;
			}





			/*============================================================================================
			カスタマーサービス　end
			customer.html
			media only screen and (max-width:639px)
			============================================================================================*/

			/*============================================================================================
			よくあるご質問　start
			faq.html
			media only screen and (max-width:639px)
			============================================================================================*/
			#faqContainer {
				width: 300px;
			}

			#faqSummary {
				width: 300px;
			}

			#faqSummary li {
				margin-bottom: 10px;
			}

			#contactSec {
				width: 315px;
			}
			/*============================================================================================
			よくあるご質問　start
			faq.html
			media only screen and (max-width:639px)
			============================================================================================*/


			/*============================================================================================
			会社概要　start
			company.html
			media only screen and (max-width:639px)
			============================================================================================*/
			#comTableContainer {
				margin-top: 40px;
				width: 300px;
			}

			#comTableContainer dt,
			#comTableContainer dd {
				line-height: 17px;
				padding-top: 10px;
				padding-bottom: 10px;
			}

			/*============================================================================================
			会社概要　end
			company.html
			media only screen and (max-width:639px)
			============================================================================================*/

			/*============================================================================================
			商品一覧＋商品詳細ページ　共通メガメニュー　start
			company.html
			media only screen and (max-width:639px)
			============================================================================================*/
			#Product #Content {
				width: 320px;
			}

			#brandMenu {
				height: auto;
			}

			#brandMenu ul.brandNavi {
				width: 318px;
				margin-left: 0;
				position: relative;
				top: 0;
				left: 0;
			}

			ul.brandNavi li.menuArea01,
			ul.brandNavi li.menuArea02,
			ul.brandNavi li.menuArea03 {
				width: 100%;
				margin-left: 0;
			}

			#brandMenu h3 {
				width: 100%;
			}

			#brandMenu h3 a {
				width: 100%;
			}

			#brandMenu li ul#menuHide {
				width: 279px;
			}

			#travColl {
				margin-left: 10px;
				margin-right: 10px;
			}

			#brandMenu li#menuChild01 ul li,
			#brandMenu li#menuChild02 ul li,
			#brandMenu li#menuChild03 ul li {
				width: 100%;
			}

			#brandMenu li#menuChild01 ul li a,
			#brandMenu li#menuChild02 ul li a,
			#brandMenu li#menuChild03 ul li a {
				padding-top: 5px;
				padding-bottom: 5px;
				width: 100%;
				display: block;
			}



			/*============================================================================================
			商品一覧＋商品詳細ページ　共通メガメニュー　end
			company.html
			media only screen and (max-width:639px)
			============================================================================================*/


			/*============================================================================================
			商品詳細ページ　start
			media only screen and (max-width:639px)
			============================================================================================*/
			#detailBox {
				margin-top: 10px;
			}
			#detailBanner {
				text-align: center;
			}
			#detailDescBox {
				margin-top: 20px;
			}

			#detailMainImage {
				width: 320px;
				height: auto;
			}

			#detailViewer {
				margin-top: 20px;
				margin-left: 10px;
				position: relative;
			}

			#detailName {
				padding-top: 0px;
				padding-bottom: 5px;
				width: 320px;
				height: auto;
				text-align: left;
				float: none;
				border-bottom: 1px dotted #ccc;
			}

			#detailCom {
				padding-top: 10px;
				padding-left: 0px;
				width: 320px;
				height: auto;
				float: none;
				border-left: none;
			}

			#detailColVariBox {
				margin-top: 20px;
				margin-left: 10px;
			}

			.detailColVari {
				float: none;
				margin-left: 0;
				margin-bottom: 10px;
			}

			#detailColVari04, #detailColVari05, #detailColVari06 {
			margin-top: 0px;
			}

			#detailColVari06 {
				margin-bottom: 0;
			}

			#detailBtn {
				width: 320px;
				text-align: center;
			}

			.detailInfomation {
				margin-left: 10px;
				margin-right: 10px;
			}
			/*============================================================================================
			商品詳細ページ　start
			media only screen and (max-width:639px)
			============================================================================================*/


			/*============================================================================================
			ご使用前の注意事項ページ　start
			media only screen and (max-width:639px)
			============================================================================================*/
			#Caution #Content {
				width: 320px;
			}


			/*============================================================================================
			ご使用前の注意事項ページ　end
			media only screen and (max-width:639px)
			============================================================================================*/

			/*============================================================================================
			修理について start
			repair.html
			media only screen and (max-width:639px)
			============================================================================================*/
			#parts01 div { float: left; }

			#repairSec ul li {
				margin-bottom: 10px;
			}

			#repairDescBox {
				margin-top: 0;
			}

			#parts06, #parts08, #parts10, #parts12, #parts14, #parts16 {
				margin-left: 0;
			}

			.partsRepairBox {
				margin-top: 40px;
				width: 300px;
				float: none;
			}

			#partsLeftBox {
				width: 150px;
				float: left;
			}

			#parts09 #partsLeftBox {
				width: 100px;
			}

			#partsRightBox {
				width: 300px;
				clear: both;
			}

			#partsDesc ul {
				clear: both;
				margin-top: 10px;
			}

			#partsDesc p {
				clear: both;
				margin-top: 10px;
			}
			/*============================================================================================
			修理について start
			repair.html
			media only screen and (max-width:639px)
			============================================================================================*/


			/*============================================================================================
			保証について start
			guarantee.html
			media only screen and (max-width:639px)
			============================================================================================*/

			#guaranteeSec {
				width: 100%;
			}
			/*============================================================================================
			保証について end
			guarantee.html
			media only screen and (max-width:639px)
			============================================================================================*/


			#repairKokuImgBox {
				margin: 0 auto;
				width: 150px;
			}

			#repairKokuImgBox div {
				margin-bottom: 20px;
				float: none;
				margin-left: 0;
			}

			#repairKokuImgBox div:first-child {
				margin-top: 20px;
			}

			.partsFloatBox {
				width: 100%;
				height: auto;
				float: none;
			}

			.partsFloatBox img {
				width: 100%;
				height: auto;
			}

			/*============================================================================================
			サムソナイトの歴史 start
			history.html
			media only screen and (max-width:639px)
			============================================================================================*/

			#historyContainer {
				margin-left: 0;
				width: 299px;
			}

			#historySec {
				width: 299px;
			}

			#timelineContainer {
				width: 299px;
			}

			#concept .timelineEvent {
				padding-right: 0;
			}

			.timelineEvent p {
				padding-right: 0;
				width: 220px;
			}

			.historySubTit {
				display: block;
				padding-left: 0;
				font-size: 14px;
			}

			#historyR {
				position: relative;
				display: none;
			}

			p.hisotryL {
				width: 220px;
			}

			.timelineEvent .spImg {
				clear: both;
				width: 220px;
				height: auto;
				padding-top: 20px;
				padding-left: 40px;
				display: block;
				text-align: left;
			}

			.timelineEvent .spImg div {
				margin-bottom: 20px;
			}

			#concept .timelineEvent h3{
				width: 220px;
			}
			#concept .timelineEvent p {
				padding-right: 0;
				width: 220px;
			}

			#h01 .timelineEvent {
				height: auto;
			}

			#h1990 .timelineEvent,
			#h2012 .timelineEvent {
				height: auto;
			}

			#h2008 .timelineEvent {
				height: auto;
			}

			span.historyTrigger {
				margin-left: 0;
				display: block;
			}


			.historyImgBox {
				display: none;
			}



			/*============================================================================================
			サムソナイトの歴史 end
			history.html
			media only screen and (max-width:639px)
			============================================================================================*/

			#sitemapSec #sitemapListTra, #sitemapSec #sitemapListBusi {
				width: 100%;
			}



			}
/* @media only screen and (max-width:639px) end*/
@media only screen and (max-width:639px) and (min-width: 376px) {

	#Copyright {
		display: block;
		width: 100%;
		margin: 0 auto;
		white-space: nowrap;
		overflow: hidden;
		font-size: 10px !important;
		transform: scale(.8);
		transform-origin: 0 0;
		position: absolute;
		left: -15px;
	}
}
@media only screen and (max-width:375px) {
	#Copyright {
		display: flex;
		justify-content: center;
		width: 100%;
		margin: auto;
		white-space: nowrap;
		font-size: 10px !important;
		transform: scale(.8);
		transform-origin: 0 0;
		position: absolute;
		left: -15px;
	}
}

/*===============================================================*/
/*
	for sp landscape
*/
/*===============================================================*/
@media only screen and (max-width:639px) and (min-width:480px) {

			div.footBnrBox {
					margin-bottom: 10%;
			}
			div#productBnrJsTrunk {
					margin-top: 10px;
					margin-left: 10px;
			}

			.pressPDF object { height: auto;}

			/*---image------------------*/
			img {
				width: 100%;
				height: auto;
			}

			/*---spacer classes---------*/
			.tb_block {display: block;}

			#Footer {
				max-width: 386px;
				margin: 0 auto;
				padding: 10px 0;
			}
			#FootLink li.facebook {
					top: 10px;
					left: 370px
			}


			/* footerブランドアイコン*/
			#brand_icon_box {
				width: 100%; /*220px*/
				margin: 25px 0 10px;
				/*display: table;*/
				display: flex;
			}
			#brand_icon_box span {
					max-width: 110px!important;
					min-width: 80px!important;
					width: 30%!important;
					height: auto;
				}
			/* footer バナー 左*/
			.sco_small_icon,
			.js_small_icon
			{
				float: left;
				margin-left: 0px!important;
				margin-right: 5%!important;
				}
			/* footerバナー 右*/
			.lipault_small_icon
			{
				float: right;
				margin-left: 5%!important;
				margin-right: 0px!important;
			}
			#kokuzi {display: none;}

			#snsWrap span.facebook a img {width: auto;}

			/*
			#FooterRight #Copyright {
				display: block;
				text-align: center;
			}
			*/

			}
			/*===============================================================*/
			/*
				for sp portrait
			*/
			/*===============================================================*/

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

			/*---------------------*/
			/*	body
			/*---------------------*/

			body {
				min-width: 320px;
			}

			#LogoWrap { min-width: 100%; }

			#snsWrap {
				right: 488px;
					top: 7px;
					/*right: 445px;*/
			}
			div.footBnrBox {
					margin-bottom: 10%;
			}
			#SideBanner li {
					float: left;
					margin-left: 0px;
			}
			div#productBnrJsTrunk {
					margin-top: 10px;
					margin-left: 10px;
			}

			#snsWrap span.facebook a img {
					max-width: inherit;
			}

			/*---------------------*/
			/*	image
			/*---------------------*/

			img {
				max-width: 100%;
			}

			/*---------------------*/
			/*	spacer classes
			/*---------------------*/

			.tb_block {
				display: block;
			}

			.sp_block {
				/*display: block;*/
			}

			#Footer {
				max-width: 386px;
				margin: 0 auto;
				padding: 10px 0;
			}
			#tb_topBtn {
					bottom: 190px;
					right: 0;
			}
			/*---footerブランドアイコン---------------*/
			#brand_icon_box {
				width: 100%;
				margin: 25px auto 0;
				/*display: table;*/
				display: flex;
			}
			#brand_icon_box span {
					max-width: 100px!important;
					min-width: 80px!important;
					height: auto;
				}
			/* footer バナー 左*/
			.sco_small_icon	{
				float: left;
				margin-left: 0px!important;
				margin-right: 5%!important;
				}
			/* footerバナー 右*/
			.lipault_small_icon,
			.js_small_icon{
				float: right;
				margin-left: 5%!important;
				margin-right: 5%!important;
			}
			#kokuzi {display: none;}

			/*
			#FooterRight #Copyright {
				display: block;
				text-align: center;
			}
			*/

}
/*---------------------*/
/*	for tb
/*---------------------*/





@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

@keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.bounceOut {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.jackInTheBox {
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}

.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}

.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
}

.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}

.animated.slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

@media (prefers-reduced-motion) {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
}
@font-face {
	font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
	speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
}
/*
@font-face {
  font-family: "Samsonite-icons";
  src: url("../icons/samsonite/Samsonite-icons.eot?bqwedk");
  src: url("../icons/samsonite/Samsonite-icons.eot?bqwedk#iefix") format("embedded-opentype"), url("../icons/samsonite/Samsonite-icons.ttf?bqwedk") format("truetype"), url("../icons/samsonite/Samsonite-icons.woff?bqwedk") format("woff"), url("../icons/samsonite/Samsonite-icons.svg?bqwedk#Samsonite-icons") format("svg");
  font-weight: normal;
  font-style: normal; }
*/
/*
[class^="sa-icon"] {
*/
  /* use !important to prevent issues with browser extensions that change fonts */
/*
  font-family: "Samsonite-icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
*/
  /* Better Font Rendering =========== */
/*
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
*/
.icon-ico-apply::before {
  content: "\E900"; }

.icon-ico-arrow-bottom::before {
  content: "\E901";
   }

.icon-ico-arrow-left::before {
  content: "\E902"; }

.icon-ico-arrow-right::before {
  content: "\E903"; }

.icon-ico-arrow-right-white-circle::before {
  content: "\E904"; }

.icon-ico-arrow-top-circle::before {
  content: "\E905"; }

.icon-ico-bag::before {
  content: "\E906"; }

.icon-ico-close::before {
  content: "\E907";
   }

.icon-ico-close-search::before {
  content: "\E908";
  color: #e2e2e2; }

.icon-ico-close-thin::before {
  content: "\E909"; }

.icon-ico-delivery::before {
  content: "\E90A";
   }

.icon-ico-filter::before {
  content: "\E90B";
   }

.icon-ico-full-collection::before {
  content: "\E90C";
   }

.icon-ico-gifting::before {
  content: "\E90D";
   }

.icon-ico-logo::before {
  content: "\E90E"; }

.icon-ico-menu-bar::before {
  content: "\E90F"; }

.icon-ico-network::before {
  content: "\E910";
   }

.icon-ico-office-site::before {
  content: "\E911";
   }

.icon-ico-peoples::before {
  content: "\E912";
   }

.icon-ico-personal-service::before {
  content: "\E913";
   }

.icon-ico-search::before {
  content: "\E914"; }

.icon-ico-secure-payment::before {
  content: "\E915";
   }

.icon-ico-sort-asc::before {
  content: "\E916"; }

.icon-ico-sort-desc::before {
  content: "\E917"; }

.icon-ico-star::before {
  content: "\E918";
   }

.icon-ico-license::before {
  content: "\E919";
   }

.icon-ico-address-tag::before {
  content: "\E91A"; }

.icon-ico-deliver::before {
  content: "\E91B"; }

.icon-ico-tsa-lock::before {
  content: "\E91C"; }

.icon-ico-samsonite::before {
  content: "\E91D"; }

.icon-ico-user::before {
  content: "\E91E";
  color: #00458f; }

.icon-ico-people::before {
  content: "\E91F"; }

.icon-ico-orders::before {
  content: "\E920"; }

.icon-ico-my-profile::before {
  content: "\E921"; }

.icon-ico-address-book::before {
  content: "\E922"; }

.icon-ico-magnify-glass::before {
  content: "\E923"; }

.icon-ico-info::before {
  content: "\E924"; }

.icon-ico-long-arrow-up::before {
  content: "\E925"; }

.icon-ico-location::before {
  content: "\E926";
  color: #084b8b; }

.icon-ico-line-brands::before {
  content: "\E927"; }

.icon-ico-cart::before {
  content: "\E928"; }

.icon-ico-arrow-down::before {
  content: "\E929"; }

.icon-ico-loyalty::before {
  content: "\E92A"; }

.icon-ico-tracking::before {
  content: "\E92B"; }

.icon-ico-facebook::before {
  content: "\E92C";
   }

@font-face {
	font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
	speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
}
/*
@font-face {
  font-family: "AT-icons";
  src: url("../fonts/AT-icons.eot?5l5b66");
  src: url("../fonts/AT-icons.eot?5l5b66#iefix") format("embedded-opentype"), url("../fonts/AT-icons.ttf?5l5b66") format("truetype"), url("../fonts/AT-icons.woff?5l5b66") format("woff"), url("../fonts/AT-icons.svg?5l5b66#AT-icons") format("svg");
  font-weight: normal;
  font-style: normal; }
*/
/*
[class^="at-icon"] {
*/
  /* use !important to prevent issues with browser extensions that change fonts */
/*
  font-family: "AT-icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
/*
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
*/
.icon-about-us::before {
  content: "\E901"; }

.icon-address::before {
  content: "\E905"; }

.icon-arrow-double-right::before {
  content: "\E912"; }

.icon-arrow-down::before {
  content: "\E90B"; }

.icon-arrow-left::before {
  content: "\E90D"; }

.icon-arrow-right::before {
  content: "\E90E"; }

.icon-arrow-up::before {
  content: "\E90C"; }

.icon-bar::before {
  content: "\E911"; }

.icon-cart::before {
  content: "\E902"; }

.icon-close::before {
  content: "\E904"; }

.icon-hamburger::before {
  content: "\E903"; }

.icon-locate::before {
  content: "\E910"; }

.icon-logo::before {
  content: "\E900"; }
  .logo-red .icon-logo::before {
    color: #d11e47; }
  .logo-orange .icon-logo::before {
    color: #ef7922; }
  .logo-yellow .icon-logo::before {
    color: #ffc012; }
  .logo-green .icon-logo::before {
    color: #80c242; }
  .logo-teal .icon-logo::before {
    color: #6ac5b0; }
  .logo-blue .icon-logo::before {
    color: #3292cf; }
  .logo-navy .icon-logo::before {
    color: #02549d; }
  .logo-purple .icon-logo::before {
    color: #c11c8a; }

.icon-order::before {
  content: "\E906"; }

.icon-payment::before {
  content: "\E907"; }

.icon-profile::before {
  content: "\E908"; }

.icon-search::before {
  content: "\E909"; }

.icon-share::before {
  content: "\E90F"; }

.icon-store-locator::before {
  content: "\E90A"; }

.icon-minicart::before {
  content: "\E913"; }

.icon-facebook::before {
  content: "\E914"; }

.icon-loyalty::before {
  content: "\E915"; }

.icon-login::before {
  content: "\E916"; }

.icon-logout::before {
  content: "\E917"; }

.icon-my-account::before {
  content: "\E918"; }

.icon-track-order::before {
  content: "\E919"; }

.icon-phone::before {
  content: "\E91A"; }

@keyframes customFadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 0.5em, 0); }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0); } }

@keyframes customFadeOutUp {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0); }
  to {
    opacity: 0;
    transform: translate3d(0, -0.5em, 0); } }

@keyframes customBounceUpDown {
  0% {
    transform: translate(-50%, 0); }
  100% {
    transform: translate(-50%, -10px); } }

@keyframes smoothScrollDown {
  0% {
    transform: translateY(-2.5em); }
  100% {
    transform: translateY(0); } }

@keyframes smoothScrollUp {
  0% {
    transform: translateY(2.5em); }
  100% {
    transform: translateY(0); } }

@keyframes brandStoryFadeInUp {
  from {
    transform: translate3d(0, 3em, 0); }
  to {
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInSlide {
  0% {
    opacity: 0;
    transform: translate3d(100px, 0, 0); }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0); } }

@keyframes rotate {
  50% {
    transform: rotate(180deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0; }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35; }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124; } }

@keyframes productSlideIn {
  0% {
    top: 100%; }
  100% {
    top: 2em; } }

@keyframes productSlideOut {
  0% {
    top: 2em; }
  100% {
    top: 100%; } }

@keyframes productSlideInDesktop {
  0% {
    left: 100%; }
  100% {
    left: 24%; } }

@keyframes productSlideOutDesktop {
  0% {
    left: 24%; }
  100% {
    left: 100%; } }

@keyframes brandStoryCustomFadeInUp {
  from {
    opacity: 0;
    transform: translate3d(-50%, 0.5em, 0); }
  to {
    opacity: 1;
    transform: translate3d(-50%, 0, 0); } }

@keyframes ani-jumb {
  0% {
    top: 0; }
  50% {
    top: -10px; }
  100% {
    top: 0; } }

@keyframes ani-opacity-bg {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@media (min-width: 992px) {
  @keyframes ani-opacity-bg {
    0% {
      opacity: 0; }
    100% {
      opacity: 0.7; } } }

@keyframes fadeInUpMT {
  from {
    opacity: 0;
    transform: translate3d(0, 100px, 0); }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInLeftMT {
  from {
    opacity: 0;
    transform: translate3d(-100px, 0, 0); }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0); } }

@keyframes fadeInOut {
  0% {
    opacity: 0; }
  20% {
    opacity: 1; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes ani-opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

/*
 *  Owl Carousel - Core
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1; }
  .owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden;
    /* fix firefox animation glitch */ }
  .owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px); }
  .owl-carousel .owl-wrapper,
  .owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0); }
  .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; }
  .owl-carousel .owl-item img {
    display: block;
    width: 100%; }
  .owl-carousel .owl-nav.disabled,
  .owl-carousel .owl-dots.disabled {
    display: none; }
  .owl-carousel .owl-nav .owl-prev,
  .owl-carousel .owl-nav .owl-next,
  .owl-carousel .owl-dot {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel .owl-nav button.owl-prev,
  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel button.owl-dot {
    background: none;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit; }
  .owl-carousel.owl-loaded {
    display: block; }
  .owl-carousel.owl-loading {
    opacity: 0;
    display: block; }
  .owl-carousel.owl-hidden {
    opacity: 0; }
  .owl-carousel.owl-refresh .owl-item {
    visibility: hidden; }
  .owl-carousel.owl-drag .owl-item {
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab; }
  .owl-carousel.owl-rtl {
    direction: rtl; }
  .owl-carousel.owl-rtl .owl-item {
    float: right; }

/* No Js */
.no-js .owl-carousel {
  display: block; }

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both; }

.owl-carousel .owl-animated-in {
  z-index: 0; }

.owl-carousel .owl-animated-out {
  z-index: 1; }

.owl-carousel .fadeOut {
  animation-name: fadeOut; }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/*
 *  Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out; }

/*
 *  Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item {
  /**
      This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
      calculation of the height of the owl-item that breaks page layouts
     */ }
  .owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    transition: opacity 400ms ease; }
  .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
    max-height: 0; }
  .owl-carousel .owl-item img.owl-lazy {
    transform-style: preserve-3d; }

/*
 *  Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000; }

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease; }

.owl-carousel .owl-video-play-icon:hover {
  transform: scale(1.3, 1.3); }

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none; }

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease; }

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%; }
/* heroがあった場所 */
.product-recommendations {
  padding-top: 3.571em;
  padding-bottom: 1.429em; }
  .product-recommendations .title {
		font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
    /*font-family: "Eina01-Bold";*/
    font-size: 1.8571rem;
    text-align: center;
    position: relative;
    margin-bottom: 1.346em; }
    .color-white .product-recommendations .title::before {
      background: linear-gradient(to right, #f3f3f3, #c8c7c6);
      background: -webkit-gradient(to right, #f3f3f3, #c8c7c6);
      background: -o-linear-gradient(to right, #f3f3f3, #c8c7c6); }
    .color-pink .product-recommendations .title::before {
      background: linear-gradient(to right, #ee99b4, #fbe6eb);
      background: -webkit-gradient(to right, #ee99b4, #fbe6eb);
      background: -o-linear-gradient(to right, #ee99b4, #fbe6eb); }
    .color-red .product-recommendations .title::before {
      background: linear-gradient(to right, #d31e47, #f37a21);
      background: -webkit-gradient(to right, #d31e47, #f37a21);
      background: -o-linear-gradient(to right, #d31e47, #f37a21); }
    .color-orange .product-recommendations .title::before {
      background: linear-gradient(to right, #f37a21, #d31e47);
      background: -webkit-gradient(to right, #f37a21, #d31e47);
      background: -o-linear-gradient(to right, #f37a21, #d31e47); }
    .color-yellow .product-recommendations .title::before {
      background: linear-gradient(to right, #ffc113, #81c341);
      background: -webkit-gradient(to right, #ffc113, #81c341);
      background: -o-linear-gradient(to right, #ffc113, #81c341); }
    .color-green .product-recommendations .title::before {
      background: linear-gradient(to right, #81c341, #ffc113);
      background: -webkit-gradient(to right, #81c341, #ffc113);
      background: -o-linear-gradient(to right, #81c341, #ffc113); }
    .color-light-blue .product-recommendations .title::before {
      background: linear-gradient(to right, #6ac6b1, #3393d0);
      background: -webkit-gradient(to right, #6ac6b1, #3393d0);
      background: -o-linear-gradient(to right, #6ac6b1, #3393d0); }
    .color-blue .product-recommendations .title::before {
      background: linear-gradient(to right, #3393d0, #6ac6b1);
      background: -webkit-gradient(to right, #3393d0, #6ac6b1);
      background: -o-linear-gradient(to right, #3393d0, #6ac6b1); }
    .color-navy .product-recommendations .title::before {
      background: linear-gradient(to right, #04559f, #c31e8c);
      background: -webkit-gradient(to right, #04559f, #c31e8c);
      background: -o-linear-gradient(to right, #04559f, #c31e8c); }
    .color-purple .product-recommendations .title::before {
      background: linear-gradient(to right, #c31e8c, #04559f);
      background: -webkit-gradient(to right, #c31e8c, #04559f);
      background: -o-linear-gradient(to right, #c31e8c, #04559f); }
    .color-beige .product-recommendations .title::before {
      background: linear-gradient(to right, #dabea0, #eee2d6);
      background: -webkit-gradient(to right, #dabea0, #eee2d6);
      background: -o-linear-gradient(to right, #dabea0, #eee2d6); }
    .color-grey .product-recommendations .title::before {
      background: linear-gradient(to right, #a6a7aa, #e4e4e4);
      background: -webkit-gradient(to right, #a6a7aa, #e4e4e4);
      background: -o-linear-gradient(to right, #a6a7aa, #e4e4e4); }
    .color-black .product-recommendations .title::before {
      background: linear-gradient(to right, #231f20, #b1afb0);
      background: -webkit-gradient(to right, #231f20, #b1afb0);
      background: -o-linear-gradient(to right, #231f20, #b1afb0); }
    .product-recommendations .title::before {
      content: '';
      display: block;
      padding: 3.2px;
      border-radius: 0.7142rem;
      position: absolute;
      z-index: 10;
      left: 50%;
      top: 100%;
      width: 1.929rem;
      transform: translateX(-50%);
      background: linear-gradient(to right, #d11e47, #ef7922);
      background: -webkit-gradient(to right, #d11e47, #ef7922);
      background: -o-linear-gradient(to right, #d11e47, #ef7922);
      margin-top: 0.5em; }
      @media (min-width: 768px) {
        .product-recommendations .title::before {
          padding: 0.2157rem 2.1428rem;
          margin-top: 0.4em;
          left: 0;
          transform: translateX(0);
          border-radius: 5px; } }
      @media (min-width: 1200px) {
        .product-recommendations .title::before {
          height: 0.571rem;
          width: 4.286rem;
          margin-top: 0.7em; } }
      @media (min-width: 1600px) {
        .product-recommendations .title::before {
          width: 5.357rem;
          height: 0.714rem; } }
      @media (min-width: 768px) {
        .product-recommendations .title::before {
          left: 50%;
          transform: translateX(-50%); } }
    @media (min-width: 992px) {
      .product-recommendations .title {
        font-size: 2rem; } }
    @media (min-width: 1600px) {
      .product-recommendations .title {
        font-size: 2.5rem; } }
  @media (min-width: 768px) {
    .product-recommendations .content {
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
      max-width: 100%; } }
  .product-recommendations .tile-message > div {
    margin-right: 0; }
  .product-recommendations .tile-message.tile-top-left {
    left: 0; }
  .product-recommendations .owl-carousel .owl-nav {
    display: block; }
    .product-recommendations .owl-carousel .owl-nav button.owl-prev, .product-recommendations .owl-carousel .owl-nav button.owl-next {
      width: 26px;
      height: 26px;
      background-color: transparent;
      color: #6b6b6b;
      font-size: 14px;
      position: absolute;
      z-index: 10;
      top: 50%;
      outline: none;
      transform: translateY(-50%);
      border-radius: 50%; }
      @media (min-width: 768px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-prev, .product-recommendations .owl-carousel .owl-nav button.owl-next {
          font-size: 1.0714rem;
          width: 35px;
          height: 35px; } }
      @media (min-width: 1600px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-prev, .product-recommendations .owl-carousel .owl-nav button.owl-next {
          width: 40px;
          height: 40px;
          font-size: 1.0714rem; } }
    .product-recommendations .owl-carousel .owl-nav button::before {
      content: "\E90E";
      position: absolute;
      left: 50%;
      top: 50%;
      background: linear-gradient(to right, #d11e47, #ef7922);
      background: -webkit-gradient(to right, #d11e47, #ef7922);
      background: -o-linear-gradient(to right, #d11e47, #ef7922);
      display: initial;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
			font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
      /*font-family: "AT-icons";*/
      font-style: normal;
      font-weight: normal;
      transform: translate(-50%, -50%); }
      @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
        .product-recommendations .owl-carousel .owl-nav button::before {
          background: none !important;
          -webkit-text-fill-color: inherit;
          color: #ef7922; } }
      @supports (-moz-appearance: none) {
        .product-recommendations .owl-carousel .owl-nav button::before {
          position: relative; } }
    .product-recommendations .owl-carousel .owl-nav button.owl-prev {
      left: -25px; }
      .product-recommendations .owl-carousel .owl-nav button.owl-prev::before {
        content: "\E90D";
        background: linear-gradient(to right, #d11e47, #ef7922);
        background: -webkit-gradient(to right, #d11e47, #ef7922);
        background: -o-linear-gradient(to right, #d11e47, #ef7922);
        display: initial;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent; }
        @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
          .product-recommendations .owl-carousel .owl-nav button.owl-prev::before {
            background: none !important;
            -webkit-text-fill-color: inherit;
            color: #ef7922; } }
      @media (min-width: 992px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-prev {
          left: -20px; } }
      @media (min-width: 1200px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-prev {
          left: -40px; } }
    .product-recommendations .owl-carousel .owl-nav button.owl-next {
      right: -25px;
      left: auto; }
      @media (min-width: 992px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-next {
          right: -20px; } }
      @media (min-width: 1200px) {
        .product-recommendations .owl-carousel .owl-nav button.owl-next {
          right: -40px; } }
    .product-recommendations .owl-carousel .owl-nav span {
      display: none; }

/***************************************************************************
	ここからここから
***************************************************************************/
.promotion-wrapper {
	font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
  /*font-family: "Eina01-Bold";*/
  scroll-behavior: smooth; }
  .promotion-wrapper .row {
    margin: 0; }
    .promotion-wrapper .row.reverse {
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse; }
  .promotion-wrapper .container {
    padding: 0;
    max-width: 100%; }
  .promotion-wrapper .main-content {
    text-align: center; }
    .promotion-wrapper .main-content img {
      width: 100%;
      display: block; }
    .promotion-wrapper .main-content .content {
      position: relative;
      margin: 0 auto; }
      @media (min-width: 1200px) {
        .promotion-wrapper .main-content .content.fiveth-content p, .promotion-wrapper .main-content .content.sixth-content p {
          max-width: 25em; } }
      @media (min-width: 1200px) {
        .promotion-wrapper .main-content .content.seventh-content p {
          max-width: 23em; } }
      @media (min-width: 992px) {
        .promotion-wrapper .main-content .content.eighth-content .content-image, .promotion-wrapper .main-content .content.last-content .content-image {
          -ms-flex: 0 0 62.5%;
          flex: 0 0 62.5%;
          max-width: 62.5%; }
        .promotion-wrapper .main-content .content.eighth-content .content-text, .promotion-wrapper .main-content .content.last-content .content-text {
          -ms-flex: 0 0 37.5%;
          flex: 0 0 37.5%;
          max-width: 37.5%; } }
      .promotion-wrapper .main-content .content .content-image {
        padding: 0; }
      @media (min-width: 768px) {
        .promotion-wrapper .main-content .content .content-text {
          padding: 0; } }
      .promotion-wrapper .main-content .content .content-text.dynamic-content {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #fff; }
        .promotion-wrapper .main-content .content .content-text.dynamic-content h1 {
          font-weight: bold; }
        .promotion-wrapper .main-content .content .content-text.dynamic-content h2 {
          font-size: 2.8em;
					font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
          /*font-family: "CamphorW01-Regular";*/ }
        .promotion-wrapper .main-content .content .content-text.dynamic-content span {
          width: 90%;
          margin: 0 auto;
          font-weight: bold; }
          @media (min-width: 768px) {
            .promotion-wrapper .main-content .content .content-text.dynamic-content span {
              width: 65%;
              font-size: 0.7765em;
              display: block; }
              .promotion-wrapper .main-content .content .content-text.dynamic-content span.plan-text {
                width: 70%; } }
          @media (min-width: 992px) {
            .promotion-wrapper .main-content .content .content-text.dynamic-content span {
              font-size: 1.045em;
              width: 55%; }
              .promotion-wrapper .main-content .content .content-text.dynamic-content span.plan-text {
                width: 60%; } }
          @media (min-width: 1200px) {
            .promotion-wrapper .main-content .content .content-text.dynamic-content span {
              font-size: 1.345em;
              max-width: 36em; }
              .promotion-wrapper .main-content .content .content-text.dynamic-content span.plan-text {
                max-width: 42em; } }
      .promotion-wrapper .main-content .content .content-text.static-content {
        color: #000; }
        @media (min-width: 768px) {
          .promotion-wrapper .main-content .content .content-text.static-content {
            position: relative; } }
      .promotion-wrapper .main-content .content .next-section {
        position: absolute;
        bottom: 1.5em;
        left: 50%;
        transform: translateX(-50%); }
        .promotion-wrapper .main-content .content .next-section.next-wrapper {
          right: 5%;
          transform: none;
          left: auto; }
          @media (min-width: 768px) {
            .promotion-wrapper .main-content .content .next-section.next-wrapper {
              right: 2%; } }
          @media (min-width: 768px) {
            .promotion-wrapper .main-content .content .next-section.next-wrapper.item-left {
              left: 2%;
              right: auto; } }
          .promotion-wrapper .main-content .content .next-section.next-wrapper span {
						font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
            /*font-family: "CamphorW01-Regular";*/
            font-size: 1.125em; }
          .promotion-wrapper .main-content .content .next-section.next-wrapper .btn-next {
            color: #000; }
        .promotion-wrapper .main-content .content .next-section .btn-next {
          color: #fff;
          font-size: 1.5rem;
          height: auto;
          line-height: 1;
          border: none;
          font-weight: normal;
          display: block; }
          .promotion-wrapper .main-content .content .next-section .btn-next::before {
						font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
            /*font-family: "AT-icons";*/
            content: "\E90B";
            font-size: 1rem; }
      .promotion-wrapper .main-content .content .content-wrapper {
        text-align: left;
        width: 23rem;
        margin: 0 auto; }
        @media (min-width: 768px) {
          .promotion-wrapper .main-content .content .content-wrapper {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%); } }
        @media (min-width: 1200px) {
          .promotion-wrapper .main-content .content .content-wrapper {
            width: 27.0714rem; } }
        .promotion-wrapper .main-content .content .content-wrapper.last {
          width: 20.7142rem; }
          @media (min-width: 1200px) {
            .promotion-wrapper .main-content .content .content-wrapper.last {
              width: 23.125rem; } }
      .promotion-wrapper .main-content .content h3 {
        font-size: 1.75rem;
        width: 82%;
        margin: 4em 0 0.75em; }
        @media (min-width: 768px) {
          .promotion-wrapper .main-content .content h3 {
            margin: 0 0 0.75em;
            width: 100%;
            font-size: 1.5em; } }
        @media (min-width: 1200px) {
          .promotion-wrapper .main-content .content h3 {
            font-size: 2em; } }
        .promotion-wrapper .main-content .content h3.full-width {
          width: 100%;
          margin: 1em 0 2em; }
          @media (min-width: 768px) {
            .promotion-wrapper .main-content .content h3.full-width {
              margin: 0 0 1em; } }
      .promotion-wrapper .main-content .content p {
				font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
        /*font-family: "CamphorW01-Regular";*/
        margin-bottom: 2.5em; }
        @media (min-width: 1200px) {
          .promotion-wrapper .main-content .content p {
            font-size: 1.3em; } }
      .promotion-wrapper .main-content .content .btn-shop {
        display: inline-block;
				font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
        /*font-family: "Eina01-Bold";*/
        font-size: 1.0714rem;
        padding: 1em 1.67em;
        min-width: 9em;
        border-radius: 1.7em;
        transition: color 0.2s ease-in, background-color 0.2s ease-in, border-color 0.2s ease-in, box-shadow 0.2s ease-in;
        box-shadow: 0 2px 7px -2px #333;
        color: #272727;
        background-color: #fff;
        border: 1px solid #f5f5f5;
        min-width: 19.643rem;
        text-align: center;
        padding: 0.714rem 0;
        margin-bottom: 8rem; }
        .promotion-wrapper .main-content .content .btn-shop:hover, .promotion-wrapper .main-content .content .btn-shop:focus {
          cursor: pointer; }
        .promotion-wrapper .main-content .content .btn-shop:hover {
          color: #fff;
          background-color: #272727;
          border-color: #272727; }
        .promotion-wrapper .main-content .content .btn-shop.last-content {
          margin-bottom: 7rem; }
        @media (min-width: 768px) {
          .promotion-wrapper .main-content .content .btn-shop {
            margin-bottom: 0;
            font-size: 0.8567em; } }
        @media (min-width: 992px) {
          .promotion-wrapper .main-content .content .btn-shop {
            min-width: 21.429rem;
            padding: 0.964rem 0; } }
        @media (min-width: 1200px) {
          .promotion-wrapper .main-content .content .btn-shop {
            font-size: 1.175em;
            padding: 0.643rem 0 0.75rem; } }
        .promotion-wrapper .main-content .content .btn-shop.selected, .promotion-wrapper .main-content .content .btn-shop:hover {
          background-color: #272727;
          color: #fff; }
    .promotion-wrapper .main-content .has-animation.load-animation .first-animation {
      animation-delay: 0.2s; }
    .promotion-wrapper .main-content .has-animation.load-animation .second-animation {
      animation-delay: 0.5s; }
    .promotion-wrapper .main-content .has-animation.load-animation .third-animation {
      animation-delay: 0.8s; }
    .promotion-wrapper .main-content .has-animation.load-animation .animation {
      opacity: 1;
      filter: alpha(opacity=1);
      animation-name: customFadeInUp;
      animation-duration: 1s;
      animation-fill-mode: both; }
    .promotion-wrapper .main-content .has-animation .animation {
      opacity: 0;
      filter: alpha(opacity=0); }
    .promotion-wrapper .main-content .first-content h1,
    .promotion-wrapper .main-content .first-content h2 {
      animation-name: customFadeInUp;
      animation-duration: 1s;
      animation-fill-mode: both; }
    .promotion-wrapper .main-content .first-content h1 {
      animation-delay: 0.3s; }
    .promotion-wrapper .main-content .first-content h2 {
      animation-delay: 0.8s; }
    .promotion-wrapper .main-content .first-content .next-section,
    .promotion-wrapper .main-content .second-content .next-section,
    .promotion-wrapper .main-content .third-content .next-section {
      transform: translateX(0); }
    .promotion-wrapper .main-content .first-content .btn-next,
    .promotion-wrapper .main-content .second-content .btn-next,
    .promotion-wrapper .main-content .third-content .btn-next {
      animation-iteration-count: infinite;
      -webkit-animation-iteration-count: infinite;
      animation-direction: alternate;
      -webkit-animation-direction: alternate;
      transform: translateX(-50%);
      animation-name: customBounceUpDown;
      animation-duration: 0.7s; }
    @media (min-width: 992px) {
      .promotion-wrapper .main-content .fiveth-content .btn-shop,
      .promotion-wrapper .main-content .eighth-content .btn-shop,
      .promotion-wrapper .main-content .last-content .btn-shop {
        min-width: 17.143rem; } }
  .promotion-wrapper .promotion-banner {
    padding-bottom: 1rem; }
    @media (min-width: 768px) {
      .promotion-wrapper .promotion-banner {
        margin: 4em 0 6em; } }
    .promotion-wrapper .promotion-banner::before {
      content: none; }
    .promotion-wrapper .promotion-banner .row {
      margin: 0 auto; }
    .promotion-wrapper .promotion-banner .container-fluid {
      padding-left: 0;
      padding-right: 0; }
    .promotion-wrapper .promotion-banner .hero-category span {
			font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
      /*font-family: "CamphorW01-Regular";*/
      margin-bottom: 0.25rem;
      display: inline-block; }
    .red-2-orange .promotion-wrapper .promotion-banner .hero-category::before {
      background: linear-gradient(to right, #d11e47, #ef7922);
      background: -webkit-gradient(to right, #d11e47, #ef7922);
      background: -o-linear-gradient(to right, #d11e47, #ef7922); }
    .yellow-2-green .promotion-wrapper .promotion-banner .hero-category::before {
      background: linear-gradient(to right, #ffc012, #80c242);
      background: -webkit-gradient(to right, #ffc012, #80c242);
      background: -o-linear-gradient(to right, #ffc012, #80c242); }
    .teal-2-blue .promotion-wrapper .promotion-banner .hero-category::before {
      background: linear-gradient(to right, #6ac5b0, #3292cf);
      background: -webkit-gradient(to right, #6ac5b0, #3292cf);
      background: -o-linear-gradient(to right, #6ac5b0, #3292cf); }
    .navy-2-purple .promotion-wrapper .promotion-banner .hero-category::before {
      background: linear-gradient(to right, #02549d, #c11c8a);
      background: -webkit-gradient(to right, #02549d, #c11c8a);
      background: -o-linear-gradient(to right, #02549d, #c11c8a); }
    .promotion-wrapper .promotion-banner .hero-category .item3 {
      padding-right: 0.321rem; }
  .promotion-wrapper .product-recommendations {
    padding: 0; }
    @media (min-width: 768px) {
      .promotion-wrapper .product-recommendations {
        padding: 3em 0; } }
    @media (min-width: 992px) {
      .promotion-wrapper .product-recommendations {
        max-width: 90%;
        margin: 0 auto; } }
    @media (min-width: 768px) {
      .promotion-wrapper .product-recommendations .owl-carousel {
        max-height: 16em; } }
    @media (min-width: 992px) {
      .promotion-wrapper .product-recommendations .owl-carousel {
        max-height: 24em; } }
    @media (min-width: 992px) {
      .promotion-wrapper .product-recommendations .owl-carousel {
        max-height: none; } }
    .promotion-wrapper .product-recommendations .owl-carousel .owl-nav {
      display: block; }
      .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev, .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-next {
        width: 26px;
        height: 26px;
        background-color: transparent;
        color: #6b6b6b;
        font-size: 14px;
        position: absolute;
        z-index: 10;
        top: 50%;
        outline: none;
        transform: translateY(-50%);
        border-radius: 50%; }
        @media (min-width: 768px) {
          .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev, .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-next {
            font-size: 1.0714rem;
            width: 35px;
            height: 35px; } }
        @media (min-width: 1600px) {
          .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev, .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-next {
            width: 40px;
            height: 40px;
            font-size: 1.0714rem; } }
      .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button::before {
        content: "\E90E";
        position: absolute;
        left: 50%;
        top: 50%;
        color: #408ebf;
				/* font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif"; */
        font-family: "AT-icons";
        font-style: normal;
        font-weight: normal;
        transform: translate(-50%, -50%); }
        @supports (-moz-appearance: none) {
          .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button::before {
            position: relative; } }
      .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev {
        left: 5px; }
        .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev::before {
          content: "\E90D";
          color: #408ebf; }
        @media (min-width: 992px) {
          .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-prev {
            left: -40px; } }
      .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-next {
        right: 5px;
        left: auto; }
        @media (min-width: 992px) {
          .promotion-wrapper .product-recommendations .owl-carousel .owl-nav button.owl-next {
            right: -40px; } }
      .promotion-wrapper .product-recommendations .owl-carousel .owl-nav span {
        display: none; }

.sl-body {
  margin: 0;
  padding: 0;
  -webkit-overflow-scrolling: touch;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .sl-body::-webkit-scrollbar {
    display: none; }
  .sl-body .sl-section-wrap .vh-100 {
    height: 100vh; }
  .sl-body .sl-home,
  .sl-body .sl-main {
		font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
    /*font-family: "HelveticaNeue-Light";*/
    font-size: 16px;
    color: #272727; }
    @media (min-width: 992px) {
      .sl-body .sl-home,
      .sl-body .sl-main {
        font-size: 18px; } }
    .sl-body .sl-home img,
    .sl-body .sl-main img {
      display: block; }
    .sl-body .sl-home .btn.rounded-pill,
    .sl-body .sl-main .btn.rounded-pill {
      display: inline-block; }
  .sl-body #footer {
    padding-top: 0;
    padding-bottom: 0; }
    .sl-body #footer .container-fluid {
      padding-top: 1.25em;
      padding-bottom: 1.25em; }
  .sl-body .back-to-top {
    z-index: 9; }
  .sl-body .rounded-pill {
    border-radius: 50rem; }
  .sl-body .sl-cursor {
    cursor: pointer; }
  @media (min-width: 1200px) {
    .sl-body .container,
    .sl-body .container-xl {
      max-width: 100%;
      padding: 0; } }
  .sl-body .text-dark {
    color: #272727; }
  .sl-body .bg-dark {
    background-color: #272727; }
  .sl-body .btn-dark {
    background-color: #000; }
  .sl-body .sl-section .sl-des {
    font-size: 14px;
		font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
    /*font-family: "CamphorW01-Regular";*/ }
    .sl-body .sl-section .sl-des h1 {
      font-size: 30px;
      line-height: 1;
			font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
      /*font-family: "Eina01-Bold";*/ }
    .sl-body .sl-section .sl-des h2 {
      font-size: 26px;
			font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
      /*font-family: "Eina01-Bold";*/ }
    .sl-body .sl-section .sl-des sub {
      font-size: 11px; }
    @media (min-width: 992px) {
      .sl-body .sl-section .sl-des {
        font-size: 16px;
        line-height: 30px; }
        .sl-body .sl-section .sl-des h1 {
          font-size: 60px; }
        .sl-body .sl-section .sl-des h2 {
          font-size: 35px; }
        .sl-body .sl-section .sl-des sub {
          font-size: 14px; } }
  .sl-body .sl-section .sl-btn-shop {
    min-width: 200px;
    font-size: 15px;
		font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
    /*font-family: "Eina01-Bold";*/ }
    @media (min-width: 992px) {
      .sl-body .sl-section .sl-btn-shop {
        min-width: 250px;
        font-size: 20px; } }
  .sl-body .sl-section .sl-item {
    max-width: 1200px; }
  .sl-body .sl-section-1 {
    opacity: 0; }
    /* @media (min-width: 992px) {
      .sl-body .sl-section-1 {
        height: 100vh; } } */
    .sl-body .sl-section-1.load-animation {
      animation: ani-opacity 1.5s;
      animation-timing-function: ease-in-out;
      opacity: 1; }
    .sl-body .sl-section-1 .sl-des {
      max-width: 1200px; }
  .sl-body .sl-section-2 .sl-item,
  .sl-body .sl-section-2 .sl-section-title,
  .sl-body .sl-section-3 .sl-item,
  .sl-body .sl-section-3 .sl-section-title,
  .sl-body .sl-section-4 .sl-item,
  .sl-body .sl-section-4 .sl-section-title {
    opacity: 0; }
    .sl-body .sl-section-2 .sl-item.load-animation,
    .sl-body .sl-section-2 .sl-section-title.load-animation,
    .sl-body .sl-section-3 .sl-item.load-animation,
    .sl-body .sl-section-3 .sl-section-title.load-animation,
    .sl-body .sl-section-4 .sl-item.load-animation,
    .sl-body .sl-section-4 .sl-section-title.load-animation {
      animation: ani-opacity 1s ease-in-out;
      opacity: 1; }
  .sl-body .sl-bg img {
    width: 100%;
    object-fit: cover; }

.atcare-page {
  font-size: 1rem;
	font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
  /*font-family: "CamphorW01-Regular";*/
  color: #fff;
  letter-spacing: 0.05rem; }
  .atcare-page .section-content {
    position: relative; }
    .atcare-page .section-content .background-image img {
      width: 100vw; }
    .atcare-page .section-content .main-content {
      position: absolute;
      text-align: center;
      color: #fff;
      line-height: 1.5; }
	@media (max-width: 767px) {
		.atcare-page #first-content .section-content .main-content {
		  position: absolute;
		  text-align: center;
		  color: #fff;
		  line-height: 1.75;
		  top: 5%; 
    }
    .atcare-page #second-content .section-content .main-content {
		  position: absolute;
		  text-align: center;
		  color: #fff;
		  line-height: 1.75;
		  top: 11%; 
    }
    .atcare-page #fourth-content .section-content .main-content {
		  position: absolute;
		  text-align: center;
		  color: #fff;
		  line-height: 1.75;
		  top: 10%; 
    }
	}
			/*
      @media (min-width: 992px) {
        .atcare-page .section-content .main-content {
          margin: 0 10%; } }
			*/
			@media (min-width: 992px) {
        .atcare-page .section-content .main-content {
          margin: -20px 10%; } }
      .atcare-page .section-content .main-content picture,
      .atcare-page .section-content .main-content img {
        margin: 0 auto; }
        @media (min-width: 768px) {
          .atcare-page .section-content .main-content picture,
          .atcare-page .section-content .main-content img {
            width: 60%; } }
      .atcare-page .section-content .main-content h2 {
        font-size: 2.643rem; }
        @media (min-width: 768px) {
          .atcare-page .section-content .main-content h2 {
            font-size: 1.4286rem; } }
        @media (min-width: 992px) {
          .atcare-page .section-content .main-content h2 {
            font-size: 1.8571rem; } }
        @media (min-width: 1200px) {
          .atcare-page .section-content .main-content h2 {
            font-size: 2.643rem; } }
        @media (min-width: 1200px) {
          .atcare-page .section-content .main-content h2 {
            font-size: 3.2143rem; }
					.margin-title {font-size: 2.5rem; } }
      @media (min-width: 768px) {
        .atcare-page .section-content .main-content p {
          font-size: 0.786rem;
          line-height: 1.5; } }
      @media (min-width: 992px) {
        .atcare-page .section-content .main-content p {
          font-size: 0.857rem; } }
      @media (min-width: 1050px) {
        .atcare-page .section-content .main-content p {
          font-size: 1.1429rem;
          line-height: 1.8; } }
      @media (min-width: 1600px) {
        .atcare-page .section-content .main-content p {
          font-size: 1.25rem; } }
      .atcare-page .section-content .main-content iframe {
        width: 150vw;
        height: 65vw; }
        @media (min-width: 768px) {
          .atcare-page .section-content .main-content iframe {
            height: 31vw; } }
        @media (min-width: 992px) {
          .atcare-page .section-content .main-content iframe {
            width: 170vw; } }
  .atcare-page .section-content-1 {
    z-index: 1; }
    @media (min-width: 768px) {
      .atcare-page .section-content-1 .main-content {
        margin: 0;
        left: 50%;
        transform: translateX(-50%);} }
    .atcare-page .section-content-1 .main-content a:hover, .atcare-page .section-content-1 .main-content a:focus {
      opacity: 50%; }
    .atcare-page .section-content-1 .main-content .sustainability-icon img {
      width: 75%; }
      @media (min-width: 768px) {
        .atcare-page .section-content-1 .main-content .sustainability-icon img {
          width: 50%; } }
  .atcare-page .section-content-2 .background-image {
    margin-top: -130px; }
    @media (min-width: 768px) {
      .atcare-page .section-content-2 .background-image {
        margin-top: -10%; } }
  @media (min-width: 768px) {
    .atcare-page .section-content-2 .main-content {
      top: 17%; } }

		/**********************
			.atcare-page .section-content-2 .main-content .microban-logo {
    width: 55%;
    margin-top: 60px; }
		**********************/
  	.atcare-page .section-content-2 .main-content .microban-logo {
    	width: 40%;
    	margin-top: 1rem;
      margin-bottom: 1rem !important;
		}

		/********************** 200904 .microban-img **********************/
		.atcare-page .section-content-2 .main-content .microban-img {
			width: 70%;
			margin: 60px auto;
		}
		@media (min-width: 768px) {
			.atcare-page .section-content-2 .main-content .microban-img {
				margin-top: 30px;
			}
		}

		/********************** 200904 down-wrap **********************/
		@media (min-width: 1400px) {
  		.atcare-page .section-content-2 .main-content .content-icon .down-wrap {
				margin-top: 30%;
			}
		}

  .atcare-page .section-content-2 .main-content .content-icon {
		font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
    /*font-family: "Eina01-Bold";*/
    font-size: 0.786rem; }
    @media (min-width: 768px) {
      .atcare-page .section-content-2 .main-content .content-icon {
        margin: 0 5%; } }

		/**********************
			旧css
			@media (min-width: 992px) {
      	.atcare-page .section-content-2 .main-content .content-icon {
        margin-top: 90px; } }
    	@media (min-width: 1200px) {
      	.atcare-page .section-content-2 .main-content .content-icon {
        margin-top: 140px; } }
			@media (min-width: 1400px) {
  	  	.atcare-page .section-content-2 .main-content .content-icon {
        margin-top: 15%; } }
		**********************/
		@media (min-width: 768px) {
      .atcare-page .section-content-2 .main-content .content-icon {
        margin-top: 10%;
			}
		}
    .atcare-page .section-content-2 .main-content .content-icon div {
      margin-top: 0;
    }
		/* icon-10%down */
    .atcare-page .section-content-2 .main-content .content-icon img {
      width: 40%; }
      @media (min-width: 768px) {
        .atcare-page .section-content-2 .main-content .content-icon img {
          width: 40%; } }
      @media (min-width: 768px) {
        .atcare-page .section-content-2 .main-content .content-icon img.sticky-3 {
          width: 32%; } }
      .atcare-page .section-content-2 .main-content .content-icon img.sticky-4 {
        width: 46%; padding-top: 0.5rem; }
        @media (min-width: 768px) {
          .atcare-page .section-content-2 .main-content .content-icon img.sticky-4 {
            width: 49%; } }

  .atcare-page .section-content-2 .main-content ul {
    line-height: 1.2; }
    @media (min-width: 768px) {
      .atcare-page .section-content-2 .main-content ul {
        margin: 5% 20% 0; } }
    @media (min-width: 992px) {
      .atcare-page .section-content-2 .main-content ul {
        margin: 10% 14% 0; } }
    @media (min-width: 1200px) {
      .atcare-page .section-content-2 .main-content ul {
        margin-left: 18%;
        margin-right: 18%; } }
    @media (min-width: 1920px) {
      .atcare-page .section-content-2 .main-content ul {
        margin-left: 24%;
        margin-right: 24%; } }
    .atcare-page .section-content-2 .main-content ul .info-text {
			font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif";
      /*font-family: "Eina01-Bold";*/
      font-size: 0.786rem; }
      @media (min-width: 1200px) {
        .atcare-page .section-content-2 .main-content ul .info-text {
          font-size: 1rem; } }
      @media (min-width: 1600px) {
        .atcare-page .section-content-2 .main-content ul .info-text {
          font-size: 1.1429rem; } }
    .atcare-page .section-content-2 .main-content ul li {
      font-size: 0.7143rem; }
      @media (min-width: 768px) {
        .atcare-page .section-content-2 .main-content ul li {
          width: 90%; } }
      @media (min-width: 1200px) {
        .atcare-page .section-content-2 .main-content ul li {
          font-size: 0.857rem; } }
      .atcare-page .section-content-2 .main-content ul li:last-child {
        list-style: none; }
  @media (min-width: 768px) {
    .atcare-page .section-content-2 .next-section {
      bottom: 17%; } }
  .atcare-page .section-content-3 {
    z-index: 1; }
    .atcare-page .section-content-3 .background-image {
      margin-top: -195px; }
      @media (min-width: 768px) {
        .atcare-page .section-content-3 .background-image {
          margin-top: -19%; } }
    .atcare-page .section-content-3 .main-content {
      top: 22%; }      
      @media (max-width: 350px) {
        .atcare-page .section-content-3 .main-content {
          top: 20%; }
        }
      @media (min-width: 768px) {
        .atcare-page .section-content-3 .main-content {
          top: 28%; }}
      @media (min-width: 992px) {
        .atcare-page .section-content-3 .main-content {
          top: 34%;
          left: 0;
          right: 0;
          margin: auto !important; } }

			/* icon-10%down */
			/*
      .atcare-page .section-content-3 .main-content img {
        width: 75%; }
        @media (min-width: 768px) {
          .atcare-page .section-content-3 .main-content img {
            width: 45%; } }
        @media (min-width: 1600px) {
          .atcare-page .section-content-3 .main-content img {
            width: 60%; } } */
      .atcare-page .section-content-3 .main-content img {
        width: 45%;
        margin: 1rem auto;}
      /* margin: 0 auto!important; } */
        @media (min-width: 768px) {
          .atcare-page .section-content-3 .main-content img {
            width: 35%; } }
        @media (min-width: 1600px) {
          .atcare-page .section-content-3 .main-content img {
            width: 50%;
          max-width: 400px;
        margin: 0; } }

  .atcare-page .section-content-4 {
    margin-bottom: 100px;
    position: relative;
    z-index: 2;}
    @media (min-width: 768px) {
      .atcare-page .section-content-4 {
        margin-bottom: 0;
        position: relative;
        z-index: 2; } }
    .atcare-page .section-content-4 .background-image {
      margin-top: -19%; }
      @media (min-width: 768px) {
        /* .atcare-page .section-content-4 .background-image { 
          margin-top: -16%; } }*/
    .atcare-page .section-content-4 .main-content {
      top: 27%; }
      @media (min-width: 768px) {
        .atcare-page .section-content-4 .main-content {
          top: 38%; } }

			/* icon-10%down */
			/* .atcare-page .section-content-4 .main-content img {
        width: 80%; }
        @media (min-width: 768px) {
          .atcare-page .section-content-4 .main-content img {
            width: 55%; } }
        @media (min-width: 1600px) {
          .atcare-page .section-content-4 .main-content img {
            width: 65%; } } */
      .atcare-page .section-content-4 .main-content img {
        width: 70%; }
        @media (min-width: 768px) {
          .atcare-page .section-content-4 .main-content img {
            width: 45%; } }
        @media (min-width: 1600px) {
          .atcare-page .section-content-4 .main-content img {
            width: 55%; } }

      @media (min-width: 992px) {
        .atcare-page .section-content-4 .main-content iframe {
          width: 200vw; } }
    .atcare-page .section-content-4 .next-section {
      bottom: 2%; }
      @media (min-width: 768px) {
        .atcare-page .section-content-4 .next-section {
          bottom: 9%; } }
  @media (min-width: 992px) {
    .atcare-page .sl-section-1 {
      height: 100%; } }
  .atcare-page .next-section {
    position: absolute;
    bottom: 1.5em;
    left: 50%;
    bottom: 7%;
    z-index: 2; }
    @media (min-width: 768px) {
      .atcare-page .next-section {
        bottom: 9%; } }
    @media (min-width: 992px) {
      .atcare-page .next-section {
        bottom: 11%; } }
    .atcare-page .next-section .btn-next {
      color: #fff;
      font-size: 1.5rem;
      height: auto;
      line-height: 1;
      border: none;
      font-weight: normal;
      display: block;
      animation-iteration-count: infinite;
      -webkit-animation-iteration-count: infinite;
      animation-direction: alternate;
      -webkit-animation-direction: alternate;
      transform: translateX(-50%);
      animation-name: customBounceUpDown;
      animation-duration: 0.7s; }
      .atcare-page .next-section .btn-next::before {
				/* font-family: Arial, メイリオ,"Conduit ITC Pro Light","Bauhaus Medium","sans-serif"; */
        font-family: "AT-icons";
        content: "\E90B";
        font-size: 1rem; }
  .atcare-page .content-image,
  .atcare-page .content-icon,
  .atcare-page .content-text {
    opacity: 0; }
    .atcare-page .content-image.has-animation.load-animation,
    .atcare-page .content-icon.has-animation.load-animation,
    .atcare-page .content-text.has-animation.load-animation {
      animation: ani-opacity 0.5s ease-in-out;
      opacity: 1; }


/*---------------------*/
/*	MASH add 20210831
/*---------------------*/
}
.sl-section.container-fluid{
  padding-left:0!important;
  padding-right:0!important;
}
.page {
  overflow: hidden;
}
@media (max-width: 768px) {
  .atcare-page .section-content-4 .background-image {
    margin-top: -50%;
  }
  .atcare-page #fourth-content .section-content-4 .background-image {
    margin-top: -60%;
  }
  .yellowTitle {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem!important;
  }
}
.yellowTitle {
  margin-top: 0 !important;
  margin-bottom: 1.5rem!important;
}
.yellowTxt {
  /* padding-bottom: 0!important; */
  padding-top: 0 !important;
}
.atcare-page .next-section.yellowSec {
  bottom: 4%!important;
}

/* 211022追記 */
p.content-text.has-animation.pt-2.mb-3.pb-4.mb-md-1.pt-md-0.yellowTxt.load-animation {
  text-align: left;
}
span.smallTxt {
  font-size: 11px;
}
section#first-content.container-fluid,
section#second-content.container-fluid,
section#third-content.container-fluid,
section#fourth-content.container-fluid {
  padding-left: 0!important;
  padding-right: 0!important;
}
@media only screen and (min-width:768px) {
  .atcare-page .section-content-4 .background-image {
    margin-top: -30%!important;
  }
  .sl-section-4 .section-content.section-content-4 .background-image {
    margin-top: -30%!important;
  }
}

section#first-content .atcare-page .next-section {
    bottom: 13%;
}
.atcare-page .section-content-4 .next-section {
  bottom: 10%;
}
section#third-content .next-section.item-center {
  bottom: 40% !important;
}
.atcare-page .next-section {
  position: absolute;
  bottom: 1.5em;
  left: 50%;
  bottom: 13%;
  z-index: 2;
}

@media only screen and (max-width:767px) {
section#third-content .next-section.item-center {
  bottom: 25% !important;
}
}
@media only screen and (max-width:450px) {
.atcare-page .next-section {
  position: absolute;
  bottom: 1.5em;
  left: 50%;
  bottom: 15%;
  z-index: 2;
}
.atcare-page .section-content-4 .next-section {
  bottom: 3%;
}
.atcare-page section#fourth-content .next-section {
  bottom: 3%;
}
}
@media only screen and (max-width:350px) {
section#third-content .next-section.item-center {
  bottom: 25% !important;
}
}

/* 20230105 */
@media (min-width: 768px) {
  .atcare-page .section-content-1 .main-content .content-icon img {
    width: 55%;
    min-width: 80px;
  }
  .atcare-page .section-content-1 .main-content .content-icon .sustainability-icon img {
    width: 45%;
    min-width: 60px;
  }
  .d-md-flex {
      justify-content: center;
  }
  /* .atcare-page .section-content-3 .text-md-left {
    width: 100%;
  } */
}
@media (min-width: 992px) {
  .atcare-page .section-content-1 .main-content .content-icon img {
    width: 45%;
    min-width: 100px;
  }
  .atcare-page .section-content-1 .main-content .content-icon .sustainability-icon img {
    width: 35%;
    min-width: 80px;
  }
}
.row.align-items-center.has-animation.load-animation.content-icon {
  justify-content: center;
  flex-wrap: nowrap;
}
.row.align-items-center.has-animation.load-animation.content-icon a {
  margin-top: 0 !important;
}
@media (max-width: 768px) {
  .atcare-page .section-content-1 .main-content .content-icon img {
    width: 60%;
  }
  .atcare-page .section-content-1 .main-content .content-icon .sustainability-icon img {
    width: 50%;
  }
}