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




/* ============================ Youtube ============================*/

.youtubePlayer{
	width:100%;
	margin:0 auto;
}
.youtubePlayer .youtubePlayerInner{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin:0 auto;
}
.youtubePlayer .youtubePlayerInner iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}





/* ============================ COMMON ============================*/

.pageTitleImageNomal{
	width:100%;
	padding:170px 0;
	position:relative;
}
.pageTitleImageNomal h2{
	font-family:'DINPro-Bold';
	font-size:4.5em;
	line-height:1.2;
	text-align:center;
	color:#FFF;
	position:absolute;
	top:50%;
	left:0;
	right:0;
	-webkit-transform:translateY(-50%);
	   -moz-transform:translateY(-50%);
	    -ms-transform:translateY(-50%);
	        transform:translateY(-50%);
	-webkit-text-shadow:1px 1px 8px rgba(0,0,0,0.7);
	   -moz-text-shadow:1px 1px 8px rgba(0,0,0,0.7);
	    -ms-text-shadow:1px 1px 8px rgba(0,0,0,0.7);
	     -o-text-shadow:1px 1px 8px rgba(0,0,0,0.7);
	        text-shadow:1px 1px 8px rgba(0,0,0,0.7);
}

.warranty .pageTitleImageNomal{
	background:url(../warranty/images/title_bk.jpg) center center no-repeat;
	background-size:cover;
}

.cms .pageTitleImageNomal{
	background:url(../cms/images/title_bk.jpg) center center no-repeat;
	background-size:cover;
}

.storeBlog .pageTitleImageNomal{
	background:url(../store_blog/images/title_bk.jpg) center center no-repeat;
	background-size:cover;
}






.widthStandardBox{
	width:95%;
	max-width:980px;
	margin:0 auto;
	padding-top:60px;
	font-size:1.1em;
}


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

.pageTitleImageNomal{padding:20% 0;}
.pageTitleImageNomal h2{font-size:3.6em;}
}




@media screen and (max-width: 540px){
.pageTitleImageNomal{padding:25% 0;}
.pageTitleImageNomal h2{font-size:3.0em;}

.widthStandardBox{width:90%;padding-top:40px;}
.warranty .widthStandardBox{width:95%;}

}




/* ============================ About ============================*/


.aboutMov{
	width:100%;
	max-width:1100px;
	margin:0 auto;
}


.aboutMainBox{
	width:90%;
	max-width:950px;
	margin:0 auto;
	padding-bottom:50px;
}

.aboutMainBox h2{
	font-family:'DINPro-Bold';
	text-align:center;
	font-size:3.5em;
	padding:1.8em 0;
}
.aboutMainBox h3{
	text-align:center;
	font-size:1.8em;
	font-weight:bold;
	padding-bottom:1em;
}
.aboutMainBox h3 br{
	display:none;
}
.aboutMainBox p{
	font-size:1.2em;
	line-height:1.8;
}


.aboutMainBox hr{
	height:0px;
	border:none;
	border-top:1px solid #CCC;
	margin:60px 0;
	width: 100%;
	text-align:left;
}







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

}


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


}



@media screen and (max-width: 720px) {
.aboutMainBox{padding-bottom:0;}
.aboutMainBox h2{font-size:3.0em;}
.aboutMainBox h3{font-size:1.6em;}
}



@media screen and (max-width: 540px) {
.aboutMainBox h2{font-size:2.4em;}
.aboutMainBox h3{font-size:1.4em;line-height:1.7;}
.aboutMainBox h3 br{display:block;}
.aboutMainBox p{font-size:1.1em;}
.aboutMainBox hr{margin:40px 0;}
}

@media screen and (max-width: 360px) {
.aboutMainBox h2{font-size:2.1em;}
.aboutMainBox h3{font-size:1.3em;}

}



/* ============================ Wrranty ============================*/

.warranty .widthStandardBox h3{
	font-size:1.8em;
	font-weight:700;
	text-align:center;
	padding-top:1em;
}

.warrantyWidth{
	width:92%;
	max-width:800px;
	margin:40px auto 0;
	font-size:1.1em;
}
.warrantyWidth p{
	margin-bottom:1em;
	line-height:1.7;
}
.warrantyWidth p a{
	text-decoration:underline;
	display: inline-block;
}
.warrantyWidth p span{
	font-weight:700;
}
.warrantyWidth h4{
	margin:3em 0 0.5em;
	font-weight:700;
}
.warrantyWidth h4.warrantyEntry{
	border: 1px solid #000;
	display: inline-block;
	padding: 0.3em 1em;
	margin:1.5em 0 1em;
}




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

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

@media screen and (max-width: 480px) {
.warranty .widthStandardBox h3{font-size:1.6em;}
.warrantyWidth{font-size:1.05em;}
}

@media screen and (max-width: 360px) {
.warranty .widthStandardBox h3{font-size:1.5em;}
.warrantyWidth{font-size:1.0sem;}
}





/* old
.warranty .widthStandardBox h3{
	font-size:1.1em;
}
.warrantyTableBox{
	width:100%;
	overflow:auto;
}
h4.ripairTitle{
	font-size:1.2em;
	color:#D91327;
	padding-bottom:0.5em;
	margin-top:40px;
}
.warranty .scrollIcon{
	display:none;
	width:100%;
	margin:0 auto;
	font-size:3.0em;
	line-height:1;
	text-align:center;
	color:#CCC;
}
.repair_tabel{
	width:100%;
	min-width:690px;
	text-align:center;
	font-size:0.91em;
	border-bottom:1px solid #CCC;
}
.repair_tabel thead{
	background:#F3F3F3;
}
.repair_tabel td{
	border-right:1px solid #CCC;
	box-sizing:border-box;
	padding:0.5em 0;
}
.repair_tabel .bg{
	background:#F3F3F3;
}
.repair_tabel .bdtop{
	border-top:1px solid #CCC;
}
.repair_tabel .noboder{
	border-right:none;
}


.dry_tabel{
	width:100%;
	max-width:450px;
	text-align:center;
	font-size:0.91em;
	border-bottom:1px solid #CCC;
}
.dry_tabel thead{
	background:#F3F3F3;
}
.dry_tabel td{
	border-left:1px solid #CCC;
	box-sizing:border-box;
	padding:0.5em 0;
}
.dry_tabel .bg{
	background:#F3F3F3;
}
.dry_tabel .bdtop{
	border-top:1px solid #CCC;
}
.dry_tabel .noboder{
	border-right:none;
}


.repair_info{
	margin-top:30px;
	font-size:0.91em;
}
.repair_info p{
	margin:0.2em 0;
}







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


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



@media screen and (max-width: 720px) {
.warranty .scrollIcon{display:block;}
.dry_tabel{max-width:none;}
h4.ripairTitle{text-align:center;font-size:1.4em;}
}



@media screen and (max-width: 540px) {
.warranty .widthStandardBox h3{font-size:1.0em;}
h4.ripairTitle{text-align:center;font-size:1.3em;}
}

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


*/










/* ============================ App ============================*/


.main.app{
	position:relative;
}
.app .titleBox{
	background:#FFF;
	height:300px;
	position:relative;
}


.app .titleBox h2{
	font-size:1.8em;
	font-weight:bold;
	text-align:center;
	padding-top:90px;
	color:#4C4C4C;
}
.app .titleBox h3{
	font-family:'DINPro-Medium';
	font-size:4.0em;
	text-align:center;
}



.app .iphone{
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	top:420px;
	width:400px;
}


.app .appinfo{
	width:100%;
	max-width:1200px;
	margin:0 auto;
	padding-bottom:50px;
}

.app .appleft{
	width:35%;
	min-height:600px;
	float:left;
}

.app .appright{
	width:35%;
	float:right;
}
.app .leftIn{
	margin:0 auto;
	width:80%;
}
.app .rightIn{
	margin:0 auto;
	width:80%;
	text-align:left;
	font-size:1.1em;
}
.app .leftIn .icon{
	width:90px;
	margin:0 auto;
}
.app .leftIn h3{
	font-size:1.3em;
	text-align:center;
	margin:0 auto;
	margin-top:30px;
	margin-bottom:40px;
}

.appleicon,.googleicon{
	width:190px;
	margin:0 auto;
	margin-top:10px;
}

.appleicon a:hover,
.googleicon a:hover{
	filter:alpha(opacity=70);
	-webkit-opacity: 0.7;
	-moz-opacity: 0.7;
	-ms-opacity: 0.7;
	opacity: 0.7;
}



.app .rightIn h3{
	font-size:1.2em;
	margin-top:0px;
	margin-bottom:30px;
}
.app .rightIn h4{
	font-size:1.4em;
	margin-top:0.9em;
	color:#D91327;
}
.app .rightIn h4 span{
	font-family:'DINPro-Medium';
	margin-left:0.2em;
}
.app .rightIn h5{
	font-size:1.1em;
	line-height:1;
}





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

.app .titleBox{height:280px;}

.app .iphone{position:static;width:50%;float:left;max-width:none;}
.app .appinfo{width:50%;padding-right:5%;float:right;box-sizing:border-box;}

.app .appleft{width:100%;float:none;min-height:inherit;}

.app .leftIn{width:100%;}
.app .leftIn .icon{ margin:0; width:80px;}
.app .leftIn h3{width:100%; margin:1em 0 0;text-align:left;}

.app .appright{width:100%;float:none;}
.appleicon{width:48%;float:left;}
.googleicon{width:48%;float:right;}

.app .rightIn{width:100%;margin-top:40px;}
.app .rightIn h3 br{display:none;}


}




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

.app .titleBox{height:auto;}
.app .titleBox h2{padding-top:70px;}
.app .titleBox h3{font-size:3.8em;margin-bottom:50px;}
.app .iphone{margin:0 auto;width:60%;max-width:400px;float:none;}

.app .appinfo{width:90%;float:none;padding:0;}

.app .leftIn{border-bottom:1px solid #CCC;padding-bottom:40px;}
.app .leftIn .icon{width:100px;margin:0 auto;}
.app .leftIn h3{margin-top:1.5em;text-align:center;}
.app .leftIn .iconset{max-width:400px;margin:20px auto 0;}

}



@media screen and (max-width: 540px) {
.app .titleBox h2{font-size:1.5em;padding-top:60px;}
.app .titleBox h3{font-size:3.0em;margin-bottom:30px;}
.app .leftIn .icon{width:70px;}

}

.app .appcontents:after,
.app .iconset:after,
.app .appinfo:after,
.app .appleft:after{
	  content: "";
	  display: table;
	  float:none;
	  clear: both;
}





/* ============================ TEAM ============================*/

/* -- TOP -- */
.main.teamTop{
	padding-bottom:0;
}
.teamIndexBK{
	background:url(../team/images/index_bk.jpg) center center no-repeat;
	background-size:cover;
}
.itemIndexInner{
	width:90%;
	max-width:1200px;
	margin:0 auto;
	padding:130px 0 200px;
	text-align:center;
	overflow:hidden;
	color:#000;
}
.teamIndexBK h2{
	font-family:'DINPro-Regular';
	font-size:3.8em;
	line-height:0.8;
	display:inline-block;
	text-align:left;
	color:#FFF;
	-webkit-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	   -moz-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	    -ms-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	     -o-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	        text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	
}
.teamIndexBK h2 span{
	font-family:'DINPro-Bold';
	font-size:1.2em;
}

ul.teamCategory{
	width:105%;
	font-size:0;
	text-align:center;
	margin-top:80px;
}
ul.teamCategory li{
	width:28.333333%;
	margin-right:5%;
	font-size:12px;
	background:#FFF;
	display:inline-block;
    text-align: left;
}
ul.teamCategory li a{
	display:block;
}
ul.teamCategory li a:hover{
	color:#FFF;
	background:#D91327;
}
ul.teamCategory li h3{
	font-family:'DINPro-Regular';
	font-size:2.0em;
	line-height:1;
	padding:1.2em 0.2em 0.2em;
	box-sizing:border-box;
}

ul.teamCategory .teamCateImage{
	width:100%;
	padding:60% 0;
	-webkit-transition: opacity 0.3s;
	   -moz-transition: opacity 0.3s;
	    -ms-transition: opacity 0.3s;
	        transition: opacity 0.3s;
}


ul.teamCategory .teamCateImage.sailing{
	background:url(../team/images/topcategory_sailing.jpg) center center no-repeat;
	background-size:cover;
}
ul.teamCategory .teamCateImage.outdoor{
	background:url(../team/images/topcategory_outdoor.jpg) center center no-repeat;
	background-size:cover;
}
ul.teamCategory .teamCateImage.snow{
	background:url(../team/images/topcategory_snow.jpg) center center no-repeat;
	background-size:cover;
}



/* -- IN -- */



.teamCateoryTitle{
	width:100%;
	text-align:center;
	color:#FFF;
	padding:110px 0;
}

.teamCateoryTitle h3{
	font-family:'DINPro-Regular';
	font-size:2.0em;
	line-height:0.9;
	display:inline-block;
	-webkit-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	   -moz-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	    -ms-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	     -o-text-shadow:1px 1px 7px rgba(0,0,0,0.7);
	        text-shadow:1px 1px 7px rgba(0,0,0,0.7);
}
.teamCateoryTitle h3 span{
	font-family:'DINPro-Bold';
}


.teamCateoryTitle h2{
	font-family:'DINPro-Bold';
	font-size:5.0em;
	line-height:1.0;
	padding:0;
	-webkit-text-shadow:1px 1px 9px rgba(0,0,0,0.6);
	   -moz-text-shadow:1px 1px 9px rgba(0,0,0,0.6);
	    -ms-text-shadow:1px 1px 9px rgba(0,0,0,0.6);
	     -o-text-shadow:1px 1px 9px rgba(0,0,0,0.6);
	        text-shadow:1px 1px 9px rgba(0,0,0,0.6);
}
.teamCateoryTitle.sailing{
	background:url(../team/images/sailing_title_bk.jpg) center center no-repeat;
	background-size:cover;
}
.teamCateoryTitle.outdoor{
	background:url(../team/images/outdoor_title_bk.jpg) center center no-repeat;
	background-size:cover;
}
.teamCateoryTitle.snow{
	background:url(../team/images/snow_title_bk.jpg) center center no-repeat;
	background-size:cover;
}



.teamListBox{
	width:90%;
	max-width:1300px;
	margin:5% auto 0;
	overflow:hidden;
}

.teamListBox ul.list{
	width:105.1%;
	text-align:left;
	font-size:0;
}
.teamListBox ul.list li{
	width:45%;
	margin-right:5%;
	margin-bottom:5%;
	font-size:12px;
	vertical-align:top;
	display:inline-block;
}


.teamListBox h3{
	font-family:'DINPro-Regular';
	font-size:2.3em;
	color:#D91327;
	margin-top:15px;
	line-height:1.1;
}
.teamListBox h3 span{
	font-family:'DINPro-Medium';
	font-size:0.7em;
	padding-left:0.3em;
	vertical-align:top;
	padding-top:0.2em;
	display:inline-block;
}
.teamListBox h4{
	font-size:1.1em;
	color:#D91327;
	line-height:1.2;
	margin:4px 0 15px;
}
.teamListBox p{
	font-size:1.1em;
}

.teamListBox p.homepage{
	font-size:1.2em;
    margin-top: 8px;
    font-family:'DINPro-Medium';
}
.teamListBox p.homepage a{
    display: inline-block;
}


.teamListBox .instagram{
	width:100%;
	margin-top:12px;
}
.teamListBox .instagram .icon{
	width:22px;
	display:inline-block;
	margin-right:8px;
}
.teamListBox .instagram a{
	font-size:1.2em;
	font-family:'DINPro-Medium';
	line-height:1;
	display:inline-block;
}



.teamInCategoryNav{
	width:100%;
	margin-top:30px;
}
.teamInCategoryNav ul{
	width:100%;
	font-size:0;
}
.teamInCategoryNav li{
	width:33.3333%;
	font-size:12px;
	display:inline-block;
	text-align:center;
}
.teamInCategoryNav li a,
.teamInCategoryNav li span{
	display:block;
	width:100%;
	padding:45px 0 40px;
	font-family:'DINPro-Medium';
	color:#FFF;
	font-size:2.0em;
	line-height:1;
	-webkit-text-shadow:1px 1px 7px #000;
	   -moz-text-shadow:1px 1px 7px #000;
	    -ms-text-shadow:1px 1px 7px #000;
	     -o-text-shadow:1px 1px 7px #000;
	        text-shadow:1px 1px 7px #000;
}

.teamInCategoryNav li.sailing a{
	background:url(../team/images/category_sailing_navi.jpg) center center no-repeat;
	background-size:cover;
}
.teamInCategoryNav li.outdoor a,
.teamInCategoryNav li.outdoor span{
	background:url(../team/images/category_outdoor_navi.jpg) center center no-repeat;
	background-size:cover;
}
.teamInCategoryNav li.snow a,
.teamInCategoryNav li.snow span{
	background:url(../team/images/category_snow_navi.jpg) center center no-repeat;
	background-size:cover;
}

.teamInCategoryNav li a:hover{
	filter:alpha(opacity=60);
	-webkit-opacity:0.6;
	-moz-opacity:0.6;
	opacity:0.6;
}







@media screen and (max-width: 980px) {
ul.teamCategory{width:103%;}
ul.teamCategory li{width:30.333333%;margin-right:3%;}
}


@media screen and (max-width: 768px) {
.itemIndexInner{padding:100px 0 150px;}

.teamListBox h3{font-size:2.0em;}
.teamListBox h3 span{padding-top:0.3em;}


}


@media screen and (max-width: 720px) {
/*
.teamIndexBK{
	background:url(../team/images/index_bk_sp.jpg) center center no-repeat;
	background-size:cover;
}
*/
.itemIndexInner{padding:90px 0 80px;}

.teamIndexBK h2{font-size:3.5em;}

ul.teamCategory{width:100%;}
ul.teamCategory li{width:100%;margin-right:0%;margin-bottom:30px;}
ul.teamCategory li h3{padding-top:0.8em;}
ul.teamCategory .teamCateImage{width:100%;padding:25% 0;}


ul.teamCategory .teamCateImage.sailing{
	background:url(../team/images/topcategory_sailing_sp.jpg) center center no-repeat;
	background-size:cover;
}
ul.teamCategory .teamCateImage.outdoor{
	background:url(../team/images/topcategory_outdoor_sp.jpg) center center no-repeat;
	background-size:cover;
}
ul.teamCategory .teamCateImage.snow{
	background:url(../team/images/topcategory_snow_sp.jpg) center center no-repeat;
	background-size:cover;
}



/* in */
.teamCateoryTitle h3{font-size:1.7em;}
.teamCateoryTitle h2{font-size:4.5em;}

.teamListBox ul.list{width:100%;}
.teamListBox ul.list li{width:100%;margin-right:0;margin-bottom:8%;}




.teamInCategoryNav li{width:100%;}

.teamInCategoryNav li a{padding:8% 0;}

}


@media screen and (max-width: 540px) {
.itemIndexInner{padding:60px 0 10%;}
.teamIndexBK h2{font-size:2.7em;}

ul.teamCategory{margin-top:50px;}
ul.teamCategory li{margin-bottom:5%;}
ul.teamCategory li h3{font-size:1.8em;}
ul.teamCategory .teamCateImage{padding:25% 0;}


/* in */
.teamListBox{
	margin-top:10%;
}

.teamCateoryTitle h3{font-size:1.5em;}
.teamCateoryTitle h2{font-size:4.0em;}

.teamListBox ul.list{width:100%;}
.teamListBox ul.list li{margin-bottom:40px;}
.teamListBox h3{text-align:center;line-height:1;margin-top:20px;}
.teamListBox h3 span{display:block;padding:6px 0 0;}
.teamListBox h3 span b{display:none;}
.teamListBox h4{text-align:center; margin-top:8px;}

.teamInCategoryNav li a{font-size:1.8em;padding:10% 0;}

}

@media screen and (max-width: 360px) {
.teamListBox h3{font-size:2.0em;}
.teamListBox h4{font-size:1.0em;}
.teamListBox p{font-size:1.05em;}

}














/* ============================ HITSORY ============================*/


.historyTitle{
	width:90%;
	margin:0 auto;
	text-align:center;
	padding:100px 0 100px;
}
.historyTitle h2{
	font-family:'DINPro-Regular';
	font-size:4.6em;
	line-height:1;
}
.historyTitle h3{
	font-family:'DINPro-Regular';
	font-size:1.8em;
	line-height:1.2;
	color:#4C4C4C;
	padding-top:0.5em;
}

.chronology{
	width:100%;
	max-width:1300px;
	margin:0 auto;
}
.chronology ul,
.chronology li{
	width:100%;
}
.chronology .innerBox{
	width:50%;
	padding:20% 0;
	position:relative;
}
.chronology .innerBox.left{
	float:left;
}
.chronology .innerBox.right{
	float:right;
}


.innerBox.his1877{
	background:url(../history/images/his1877.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1878{
	background:url(../history/images/his1878.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1879{
	background:url(../history/images/his1879.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1924{
	background:url(../history/images/his1924.jpg) top center no-repeat;
	background-size:cover;
}
.innerBox.his1932{
	background:url(../history/images/his1932.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1949{
	background:url(../history/images/his1949.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1961{
	background:url(../history/images/his1961.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1979{
	background:url(../history/images/his1979.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1980{
	background:url(../history/images/his1980.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his1986{
	background:url(../history/images/his1986.jpg) top center no-repeat;
	background-size:cover;
}
.innerBox.his2006{
	background:url(../history/images/his2006.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his2008{
	background:url(../history/images/his2008.jpg) center center no-repeat;
	background-size:cover;
}
.innerBox.his2015{
	background:url(../history/images/his2015.jpg) top center no-repeat;
	background-size:cover;
}
.innerBox.his2017{
	background:url(../history/images/his2017.jpg) top center no-repeat;
	background-size:cover;
}



.chronology .innerBox .textBox{
	width:80%;
	margin:-1em auto 0;
	max-width:500px;
	position:absolute;
	top:50%;
	left:0;
	right:0;
	font-size:1.2em;
	line-height:1.6;
	-webkit-transform:translateY(-50%);
	   -moz-transform:translateY(-50%);
	    -ms-transform:translateY(-50%);
	        transform:translateY(-50%);
}
.chronology .innerBox .textBox a{
	display:inline-block;
	text-decoration:underline;
}

.chronology .innerBox .textBox .year{
	font-family:'DINPro-Regular';
	color:#4C4C4C;
	font-size:3.0em;
}
.chronology .innerBox .textBox h3{
	font-size:1.3em;
	line-height:1.4;
	padding-bottom:0.5em;
	
}



.today{
	width:90%;
	margin:0 auto;
	text-align:center;
	padding:100px 0 50px;
}
.today h3{
	font-family:'DINPro-Bold';
	font-size:4.0em;
	line-height:1.2;
	padding-bottom:0.1em;
}
.today h4{
	font-family:'DINPro-Regular';
	font-size:3.3em;
	line-height:1.2;
}
.today p{
	font-size:1.2em;
	line-height:2.0;
	margin-top:1.6em;
}





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

.historyTitle{padding:80px 0;}

.chronology .innerBox{padding:22% 0;}
.chronology .innerBox .textBox{width:85%;font-size:1.1em;}

}

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

.historyTitle h2{font-size:4.2em;}
.historyTitle h3{font-size:1.7em;}

.chronology .innerBox{padding:25% 0;}
.chronology .innerBox .textBox{font-size:1.2em;}
.chronology .innerBox .textBox h3{line-height:1.5;}

}

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

.historyTitle h2{font-size:3.8em;}
.historyTitle h3{font-size:1.5em;}

.chronology .innerBox.left{float:none;}
.chronology .innerBox.right{float:none;}
.chronology .innerBox{width:100%;padding:0;}
.chronology .innerBox.imageBox{padding:35% 0;}
.chronology .innerBox .textBox{
	position:static;
	width:90%;
	margin:0 auto 60px;
	max-width:none;
	top:0;
	-webkit-transform:translateY(0);
	   -moz-transform:translateY(0);
	    -ms-transform:translateY(0);
	        transform:translateY(0);
}

.chronology .innerBox .textBox .year{font-size:3.8em;text-align:center;margin:0.5em 0 0.2em;}
.chronology .innerBox .textBox h3{text-align:center;}

.innerBox.his2017{
	background:url(../history/images/his2017sp.jpg) top center no-repeat;
	background-size:cover;
}
}

@media screen and (max-width: 540px) {
.historyTitle{padding:60px 0;}
.historyTitle h2{font-size:3.2em;}
.historyTitle h3{font-size:1.4em;}

.chronology .innerBox .textBox{margin:0 auto 50px;}
.chronology .innerBox.imageBox{padding:40% 0;}
.chronology .innerBox .textBox{font-size:1.1em;}
.chronology .innerBox .textBox .year{font-size:3.2em;}

.today{padding:30px 0 40px;}
.today h3{font-size:3.5em;}
.today h4{font-size:2.4em;}
.today p{font-size:1.1em;line-height:1.8;}
.today p br{display:none;}


}







/* ============================ CMS ============================*/



.cms .topInfo{
	width:90%;
	max-width:1000px;
	margin:80px auto 30px;
}
.cms .topInfo h3{
	text-align:center;
	font-size:2.5em;
	font-weight:bold;
	padding-bottom:30px;
}
.cms .topInfo h3 br{display:none;}

.cms .topInfo p.comment{
	font-size:1.2em;
	line-height:1.7;
}
.cms .topInfo p.easy{
	font-size:1.7em;
	text-align:center;
	margin-top:60px;
}
.cms .topInfo p.easy br{display:none;}

.cmsStepBox{
	width:100%;
	border-top:1px solid #CCC;
	line-height: 1.6;
}

.cmsStepBox .stepInner{
	width:90%;
	max-width:1200px;
	margin:0 auto;
	text-align:center;
	padding:40px 0 20px;
}
.cmsStepBox .stepInner h3{
	font-family:'DINPro-Light';
	color:#D91327;
	font-size:4.5em;
	line-height:1;
}
.cmsStepBox .stepInner h4{
	color:#D91327;
	font-size:1.8em;
	padding:1em 0;
}
.cmsStepBox .stepInner .comment{
	font-size:1.2em;
	line-height:1.7;
}
.cmsStepBox .toggleBT{
	width:46px;
	height:46px;
	background:#999;
	margin:25px auto 20px;
	cursor:pointer;
	position:relative;
	-webkit-border-radius:50%;
	   -moz-border-radius:50%;
	    -ms-border-radius:50%;
	        border-radius:50%;
	-webkit-transition:all .3s;
	   -moz-transition:all .3s;
	    -ms-transition:all .3s; 
            transition:all .3s; 
}
.cmsStepBox .stepInner .toggleBT::after{
	position:absolute;
	display:block;
    content: "";
    top:0;
    bottom:0;
    right:0;
	left:0;
    width:16px;
    height:16px;
	margin:11px auto 0;
    border-bottom:solid 2px #FFF;
    border-right:solid 2px #FFF;
	-webkit-transform:rotate(45deg);
	   -moz-transform:rotate(45deg);
	    -ms-transform:rotate(45deg);
            transform:rotate(45deg);
}

@media screen and (min-width: 769px) {
.cmsStepBox .stepInner .toggleBT:hover{
	background:#D91327;
}
}

.cmsStepBox .stepInner.clicked .toggleBT{
	-webkit-transform:rotate(180deg);
	   -moz-transform:rotate(180deg);
	    -ms-transform:rotate(180deg);
            transform:rotate(180deg);
	background:#D91327;
}





/* ---------------------- */


.stepHiddenBox{
	display:none;
	width:90%;
	max-width:1000px;
	margin:0 auto;
	padding-bottom:70px;
	overflow:hidden;
}
.stepHiddenBox .topText{
	font-size:1.1em;
	margin:20px 0;
	line-height: 1.6;
}
.stepHiddenBox .topText h5{
	font-size:1.2em;
	color:#D91327;
	padding-bottom:0.5em;
}
.stepHiddenBox .bottomNote{
	margin:20px 0 0;
	line-height: 1.6;
}
.stepHiddenBox .note{
	padding:0.3em 0;
}
.stepHiddenBox .pdf{
	margin:20px 0;	
}
.stepHiddenBox .pdf a{
	display:inline-block;
	font-size:1.2em;
	color:#D91327;
}
.stepHiddenBox .pdf a i{
	width:45px;
	display:inline-block;
	margin-right:10px;
}
.stepHiddenBox .pdf a:hover{
	filter:alpha(opacity=60);
	-webkit-opacity:0.6;
	-moz-opacity:0.6;
	opacity:0.6;
}



/* -- STEP 1 -- */

.stepHiddenBox ul.markPoint{
	width:101%;
	font-size:0;
	text-align:left;
}
.stepHiddenBox ul.markPoint li{
	width:24%;
	margin-right:1%;
	margin-bottom:2%;
	display:inline-block;
	font-size:12px;
	vertical-align:top;
}
.stepHiddenBox ul.markPoint li h3{
	font-family:'DINPro-Regular';
	line-height:1.3;
	text-align:center;
	padding:0.6em 0 0;
	font-size:1.1em;
}

.stepHiddenBox ul.markPoint li h3 a{
	font-family:'DINPro-Regular';
	word-break: keep-all;
}
.stepHiddenBox ul.markPoint li h3 span{
	font-size:1.0em;
}
.markPosition{
	text-align:center;
	margin-top:10px;
}
.markPosition a{
	border:1px solid #CCC;
	box-sizing:border-box;
	text-align:center;
	font-size:0.9em;
	padding:2px 0 3px;
	-webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  transition: all .3s ease;
}
.markPosition a:hover{
	border:1px solid #D91327;
}
.stepHiddenBox ul.markPoint li a img{
	-webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  transition: all .3s ease;
  word-break: break-all;
}

.stepHiddenBox ul.markPoint li a img:hover{
	filter:alpha(opacity=60);
	-webkit-opacity:0.6;
	-moz-opacity:0.6;
	-ms-opacity:0.6;
	opacity:0.6;
}




/* -- STEP 2 -- */

.stepHiddenBox .fontList{}

.stepHiddenBox .fontList h5{
	font-size:1.3em;
	padding-bottom:0.3em;
	color:#D91327;
	margin-bottom:20px;
	border-bottom:1px solid #CCC;
}
.stepHiddenBox .fontList h5.second{
	margin-top:30px;
}
.step02 .pdf{
	text-align:center;
	margin-top:80px;
}


/*--------------*/

.step02add{
	width: 100%;
	padding-bottom: 30px;
}
.step02add .addSet{
	width: 100%;
	margin-top: 80px;
}
.step02add .addSet h3{
	text-align:left;
	font-size:19px;
	font-weight:500;
	color: #D91327;
	border-bottom: 1px solid #C5C5C5;
	padding-bottom: 0.2em;
}
.step02add .addSet h3 br{display: none;}
.step02add .addBody{
	width: 100%;
	margin-top: 25px;
	display: flex;
	justify-content: space-between;
}
.step02add .as01 .addBody,
.step02add .as02 .addBody{flex-direction:row-reverse;}


.step02add .as01 .addBody .columnTop{width: calc(100% - 400px);}
.step02add .as01 .addBody .columnBottom{width: 350px;}

.step02add .as02 .addBody .columnTop{width: calc(100% - 580px);}
.step02add .as02 .addBody .columnBottom{
	width: 530px;
	display: flex;
	justify-content: space-between;
}
.step02add .as02 .addBody .columnBottom p:first-child{width: 50%;}
.step02add .as02 .addBody .columnBottom p:last-child{width: 46%;}

.step02add .as03 .addBody .columnTop{width: calc(100% - 640px);}
.step02add .as03 .addBody .columnBottom{
	width: 590px;
	display: flex;
	justify-content: space-between;
}
.step02add .as03 .addBody .columnBottom p{width: 32%;font-size: 12px;}

.step02add .addBody .copy{
	font-size: 14px;
	line-height: 1.8;
}
.step02add .addBody .icon{
	width: 100px;
	margin-top: 10px;
}
.step02add .attention{
	font-size: 12px;
	line-height: 1.6;
	margin-top: 1.3em;
}
.step02add .attention p{
	text-indent: -1em;
	padding-left: 1em;
}



/* -- STEP 3 -- */

.stepHiddenBox .colorList{
	width:100%;
	overflow:hidden;
}
.stepHiddenBox .colorList .textred{
	color:#F00;
	font-size: 0.9em;
}
.stepHiddenBox .colorList ul{
	width:101%;
	text-align:left;
	font-size:0;
}
.stepHiddenBox .colorList ul li{
	width:19%;
	margin-right:1%;
	margin-bottom:10px;
	font-size:12px;
	text-align:center;
	display:inline-block;
	vertical-align:top;
}
.stepHiddenBox .colorList ul li .color{
	box-sizing:border-box;
	width:100%;
	height:20px;
	margin-bottom:3px;
}

.step03 .bottomNote p{
	padding-left:1em;
	text-indent:-1em;
}





/* -- STEP 4 -- */


.stepHiddenBox .slip{
	margin-top:20px;
	font-size:1.1em;
}
.stepHiddenBox .slip h5{
	font-size:1.3em;
	color:#D91327;
	margin-bottom:10px;
}
.stepHiddenBox .slip h6{
	padding:1em 0 0.2em;
	text-indent:-0.3em;
}

.stepHiddenBox .slip .slipRight{
	width:36%;
	padding-left:4%;
	float:right;
}



/* -- STEP 5 -- */


.stepHiddenBox .price{
	margin-top:20px;
}
.stepHiddenBox .price h5{
	font-size:1.4em;
	color:#D91327;
	margin-bottom:10px;
}
.stepHiddenBox .cmsPriceTable{
	width:100%;
	font-size:1.1em;
}
.stepHiddenBox .cmsPriceTable tr:nth-child(odd){
	background:#F5F5F5;
}
.stepHiddenBox .cmsPriceTable td{
	text-align:center;
	line-height:1.2;
	padding:0.5em 0.3em;
	border-left:1px solid #CCC;
}
.stepHiddenBox .cmsPriceTable th{
	text-align:center;
	line-height:1.2;
	padding:0.5em 0.3em;
}
.stepHiddenBox .cmsPriceTable th br{
	display:none;
}


/* ---------------------- */


.cmsShoplist{
	width:100%;
	font-size:1.1em;
	margin:0 auto;
	border-top:1px solid #CCC;
    padding-top: 80px;
}

.cmsShoplist h2{
	text-align:center;
	font-size:28px;
	width:90%;
    max-width: 700px;
	margin:0 auto;
    font-weight: bold;
    line-height: 1;
    border: 2px solid #CCC;
}
.cmsShoplist h2 span{
	font-family:'DINPro-Bold';
	font-size:36px;
    font-weight: normal;
    padding-right: 10px;
}
.cmsShoplist h2 a{
    width: 100%;
    padding: 30px 0;
}









.cmsShoplist .cmsShopTable{
	width:100%;
	text-align:left;
}

.cmsShoplist .cmsShopTable tr:nth-child(odd){
	background:#F5F5F5;
}
.cmsShoplist .cmsShopTable th{
	padding:0.8em 0 0.8em 0.7em;
	box-sizing:border-box;
}
.cmsShoplist .cmsShopTable td{
	padding:0.8em 1em;
	box-sizing:border-box;
}
.cmsShoplist .cmsShopTable td.tel{
	width:9em;
	padding:0.8em 0;
}


@media screen and (max-width: 980px) {
.step02 .pdf{margin-top:50px;}

/*-----*/
.step02add .addSet{margin-top: 60px}
.step02add .addSet h3{font-size:18px;}
.step02add .as01 .addBody .columnTop{width: calc(100% - 320px);}
.step02add .as01 .addBody .columnBottom{width: 290px;}

.step02add .as02 .addBody .columnTop{width: calc(100% - 480px);}
.step02add .as02 .addBody .columnBottom{width: 450px;}

.step02add .as03 .addBody .columnTop{width: calc(100% - 510px);}
.step02add .as03 .addBody .columnBottom{width: 480px;}
.step02add .addBody .copy{font-size: 13px;}
.step02add .addBody .icon{width: 90px;}
/*-----*/

.stepHiddenBox .cmsPriceTable{font-size:1.0em;}
.cmsShoplist{font-size:1.0em;}

}


@media screen and (max-width: 768px) {
.cms .topInfo{margin-top:60px;}
.cms .topInfo h3{font-size:2.2em;padding-bottom:20px;}
.cms .topInfo p.easy{font-size:1.5em;margin-top:40px;}

.cmsStepBox .stepInner h3{font-size:4.0em;}


.stepHiddenBox ul.markPoint{width:102%;}
.stepHiddenBox ul.markPoint li{width:31.33333%;margin-right:2%;margin-bottom:4%;}

.stepHiddenBox .colorList ul li{width:24%;}
.stepHiddenBox .slip .slipLeft{width:50%;}
.stepHiddenBox .slip .slipRight{width:46%;}

/*-----*/
.step02add .as02 .addBody{display: block;}
.step02add .as02 .addBody .columnTop{width:100%;}
.step02add .as02 .addBody .columnBottom{width: 86%;margin: 20px auto 0;}
.step02add .as02 .addBody .columnBottom p:first-child{width: 48%;}
.step02add .as02 .addBody .columnBottom p:last-child{width: 44%;}

.step02add .as03 .addBody{display: block;}
.step02add .as03 .addBody .columnTop{width: 100%;}
.step02add .as03 .addBody .columnBottom{width: 100%;margin-top: 20px;}
.step02add .addBody .copy{font-size: 14px;}
/*-----*/

.step04 .pdf{text-align:center;padding:20px 0;}
.stepHiddenBox .cmsPriceTable th br{display:block;}
.stepHiddenBox .cmsPriceTable td{padding-left:0.2em;padding-right:0.2em;}

}


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

.main.cms{padding-bottom:0;}

.cms .topInfo{margin-top:40px;}
.cms .topInfo h3{font-size:2.0em;}
.cmsStepBox .stepInner h3{font-size:3.8em;}
.cmsStepBox .stepInner h4{font-size:1.6em;}

/*-----*/
.step02add{padding-bottom: 0;}
.step02add .addBody{display: block;}
.step02add .as01 .addBody .columnTop{width: 100%;}
.step02add .as01 .addBody .columnBottom{width:90%;margin: 20px auto 0;max-width: 380px;}

.step02add .as02 .addBody .columnBottom{width: 100%;}

.step02add .addBody .icon{margin: 10px auto 0;}
.step02add .as03 .addBody .columnBottom p{font-size: 11px;}
/*-----*/

.stepHiddenBox .fontList h5{text-align:center;}
.stepHiddenBox .colorList ul li{width:32.33333%;font-size:11px;}
.stepHiddenBox .slip h5{text-align:center;}
.stepHiddenBox .slip .slipRight{width:50%;margin:0 auto;padding-left:0;float:none;}
.step05 .stepHiddenBox{width:98%;}
.stepHiddenBox .price h5{text-align:center;}
.stepHiddenBox .cmsPriceTable{font-size:0.9em;}
.step05 .bottomNote{width:90%;margin:20px auto 0;}




.cmsShoplist{width:100%;}


.cmsShoplist{padding:13% 0;}
.cmsShoplist h2{font-size:22px;}
.cmsShoplist h2 span{font-size:26px;}
.cmsShoplist h2 a{padding: 30px 0;}




.cmsShoplist .cmsShopTable tr:nth-child(odd){background:none;}

.cmsShoplist .cmsShopTable th{
	padding:1.5em 5% 0.5em;
	border-top:1px solid #CCC;
	width:100%;
	display:block;
	font-size:1.2em;
	color:#D91327;
}
.cmsShoplist .cmsShopTable td{
	width:100%;
	padding:0 5% 0.2em;
	display:block;
	font-size:1.1em;
}
.cmsShoplist .cmsShopTable td.tel{width:auto;padding:0 5% 1.7em;}

}




@media screen and (max-width: 540px) {
.cms .topInfo h3{font-size:1.8em;}
.cms .topInfo h3 br{display:block;}
.cms .topInfo p.easy br{display:block;}

.stepHiddenBox{padding-bottom:40px;}
.stepHiddenBox .pdf a i{width:38px;}

.cmsStepBox .stepInner h3{font-size:3.6em;}
.cmsStepBox .stepInner h4{font-size:1.5em;}

.stepHiddenBox ul.markPoint li{width:48%;}

.stepHiddenBox .colorList ul li{width:49%;}

.stepHiddenBox .slip .slipRight{width:80%;}

.stepHiddenBox .cmsPriceTable th{font-size:0.9em;}
.stepHiddenBox .cmsPriceTable th br{ display:none;}

/*------*/

.step02add .addSet{margin-top: 13vw}
.step02add .addSet h3{font-size:16px;padding-bottom: 0.5em;}
.step02add .addSet h3 br{display: block;}
.step02add .addBody{margin-top: 15px;}
.step02add .addBody .copy{line-height: 1.7;}


.step02add .as02 .addBody .columnBottom{width: 100%;display: block;margin-top: 0;}
.step02add .as02 .addBody .columnBottom p:first-child{width: 80%;margin: 5vw auto 0;}
.step02add .as02 .addBody .columnBottom p:last-child{width: 80%; margin: 5vw auto 0;}



.step02add .as03 .addBody .columnBottom{display: block;}
.step02add .as03 .addBody .columnBottom p{width: 60%;margin: 0 auto 5vw;}


/*------*/

.cmsShoplist{padding:18% 0;}
.cmsShoplist h2{font-size:18px;}
.cmsShoplist h2 span{font-size:21px;padding-right:2px;}
.cmsShoplist h2 a{padding: 30px 0;}

.cmsShoplist .cmsShopTable th{padding:1em 5% 0.3em;}
.cmsShoplist .cmsShopTable td{padding:0 5% 0.2em;}
.cmsShoplist .cmsShopTable td.tel{padding:0 5% 1.0em;}

}

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

}




/* ============================ STORE & BLOG ============================*/

.main.storeBlog{
	background:#F3F3F3;
}

.sbListBox{
	width:94%;
	max-width:1000px;
	margin:40px auto 0;
	overflow:hidden;
}

.sbListBox ul{
	width:103%;
	font-size:0;
}

.sbListBox ul li{
	width:47%;
	margin-right:3%;
	margin-top:3%;
	display:inline-block;
	font-size:12px;
	background:#FFF;
	padding:17px;
	box-sizing:border-box;
	vertical-align:top;
	padding-bottom:80px;
	position:relative;
}

.sbListBox ul li h3{
	color:#D91327;
	font-weight:bold;
	text-align:center;
	font-size:1.5em;
	line-height:1.4;
	padding:1.4em 0 0.5em;
}

.sbListBox ul li .spec{
	font-size:1.1em;
	text-align:center;
}

.sbListBox ul li .mapIcon{
	text-align:center;
	font-size:3.0em;
	line-height:1;
	margin-top:10px;
}
.sbListBox ul li .mapIcon a{
	color:#666;
	display:inline-block;
}
.sbListBox ul li .mapIcon a:hover{
	color:#D91327;
}


.sbListBox .menuBox{
	position:absolute;
	bottom:20px;
	padding-top:15px;
	border-top:1px solid #CCC;
	width:93%;
	margin:0 auto;
	box-sizing:border-box;
	text-align:center;
}

.sbListBox .menuBox p{
	display:inline-block;
	margin:0 15px;
}
.sbListBox .menuBox p a{
	color:#D91327;
	font-family:'DINPro-Bold';
	font-size:1.7em;
	text-decoration:underline;
}
.sbListBox .menuBox p.nolink{
	color:#999;
	font-family:'DINPro-Bold';
	font-size:1.7em;
	text-decoration:underline;
}
.sbListBox .menuBox p a:hover{
	color:#383838;
}



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

.sbListBox{margin-top:5%;}
.sbListBox ul{width:102%;}
.sbListBox ul li{width:48%;margin-right:2%;margin-top:2%;}
.sbListBox ul li h3{font-size:1.4em;}

}


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

.sbListBox ul li{padding:10px 10px 80px;}
.sbListBox ul li h3{font-size:1.3em;}
.sbListBox .menuBox{width:94%;margin:0 auto;}

}

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

.sbListBox{width:90%;}
.sbListBox ul{width:100%;}
.sbListBox ul li{width:100%;margin-right:0; margin-bottom:5%;}
.sbListBox .menuBox{width:96%;}

.sbListBox .menuBox p a{font-size:1.6em;}
.sbListBox .menuBox p.nolink{font-size:1.6em;}
}