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

@media screen and (max-width : 640px){
	
/* ****************************************************
  全体の基本調整
***************************************************** */

body{ font-size:13px;}


/* 画像
=========================================*/

img.responsive-img img{ width:100%;}
.wrp-img{ position:relative;}


/* ****************************************************
  コンテナー　.container
***************************************************** */

.container{width:100%;  padding-left:30px; padding-right:30px;padding-bottom:10px;}


/* ****************************************************
  グローバルナビ　.globalNav
***************************************************** */

.globalNav .menu{ height:280px; margin-top:-140px;}
.globalNav .menu li{ margin-bottom:40px;}

/* ナビアイコンボタン
=========================================*/

.globalNav .Nav-icon{ top:20px; right:10px;}
#panel-btn:hover{transform: none; -webkit-transform:none;}

/* ****************************************************
  フッター　footer
***************************************************** */

footer{ padding:110px 0 0; height:480px; box-sizing:border-box;}
footer h2 img{ width:150px; height:28px;}
.sns{ margin:80px auto 180px; width:186px;}
.sns li{ margin-right:30px;}
.sns i{ padding:8px; font-size:18px;}


/* ****************************************************
 全ページ共通
***************************************************** */


.s1 h2 img{ width:120px; height:68px;margin-left: -60px; /* widthの半分のマイナス値 */ margin-top: -34px; /* heightの半分のマイナス値 */}
.s2 h2 img{ width:282px; height:67px;margin-left: -141px; /* widthの半分のマイナス値 */ margin-top: -33px; /* heightの半分のマイナス値 */}
.s3 h2 img{ width:196px; height:64px;margin-left: -98px; /* widthの半分のマイナス値 */ margin-top: -32px; /* heightの半分のマイナス値 */}
.contact .main-visual img{ width:282px; height:67px;margin-left: -141px; /* widthの半分のマイナス値 */ margin-top: -33px; /* heightの半分のマイナス値 */}

.s2 .main-visual{height:200px;}
.contact .main-visual{height:200px;}



	.main-visual{height:320px;}
	.first-view .concept{ display:none;}

/* MOREボタン
=========================================*/

.btn-more a{ width:80%; margin-top:10px; margin-bottom:80px;}


/* 1stビュースクロールボタン
=========================================*/

.scroll-btn a{width:18px; height:15px; font-size:25px;bottom:25px;margin-left:-9px;}


/* ****************************************************
 first-view .first-view
***************************************************** */

.first-view h1{ left:-12%; top:13%;}
.first-view .concept{ top:50%; right:-3%;}

.first-view h1 img,
.first-view .concept img{ width:100%; height:100%; padding:0;}

.first-view h1{ width:100%; left:-33%; top:15%;}
.first-view .concept{ width:85%;right:-2%; top:55%;}

.first-view .concept p{ font-size:10px; top:33%; left:0; padding-right:20px;}

.scroll-btn a{width:18px; height:15px; font-size:25px;bottom:25px;margin-left:-9px;}


/* ****************************************************
 NEWS .s1
***************************************************** */


.s1 .wrp-01{ margin-top:60px;}
.s1 .wrp-01,
.s1 .wrp-02,
.s1 .wrp-03 ul li,
.s1 .wrp-03 ul li:first-child,
.s1 .wrp-03 ul li:last-child{ padding:0; height:auto; margin-bottom:60px;}	
.s1 .wrp-01 .wrp-img,
.s1 .wrp-02 .wrp-img{ position:relative; margin-bottom:15px;}
.s1 h3{ font-size:15px !important; margin-bottom:30px!important;}
.s1 .wrp-01 h3,
.s1 .wrp-02 h3{ margin-bottom:25px!important;}
.s1 .wrp-01 p,
.s1 .wrp-02 p,
.s1 .wrp-03 p{ font-size:13px;line-height:1.4em; letter-spacing:-0.04em; width:100%; padding-left:0; margin-bottom:20px;}
.s1 .btn-more-detail a{ font-size:17px !important; float:right !important;}
.s1 .wrp-02 .wrp-img{ text-align: center;}
.s1 img.responsive-img,
.s1 .wrp-02 .wrp-img{ width:100%;}

/* ****************************************************
 COLLECTION .s2
***************************************************** */

.collection .s2 ul{ margin-bottom:0px;}

/* 右カラム
=========================================*/
.s2 .wrp-01,.s2 .wrp-02,.s2 .wrp-03,.s2 .wrp-04,.s2 .wrp-05,
.s2 .wrp-06,.s2 .wrp-07,.s2 .wrp-08,.s2 .wrp-09,.s2 .wrp-10
{ padding:0; height:auto; margin-bottom:60px; width:100%;}
.s2 .wrp-01 .wrp-img,.s2 .wrp-02 .wrp-img,.s2 .wrp-03 .wrp-img,.s2 .wrp-04 .wrp-img,.s2 .wrp-05 .wrp-img,
.s2 .wrp-06 .wrp-img,.s2 .wrp-07 .wrp-img,.s2 .wrp-08 .wrp-img,.s2 .wrp-09 .wrp-img,.s2 .wrp-10 .wrp-img
{ top:0; left:0;}


.s2 .wrp-img{width:100%!important; position:relative; margin-bottom:10px; padding:35px!important; box-sizing:border-box;}

.s2 h3{ font-size:16px !important;margin-bottom:10px!important;}	
.s2 .btn-more-detail a{ font-size:17px !important; float:right;}
.s2 .btn-more a{ margin-top:70px;}

/* ****************************************************
 ABOUT .s3
***************************************************** */

.s3 .wrp-03 .wrp-img{ width:80%; position:relative; padding:0; margin:auto;}

/* MOREボタン
=========================================*/

.s3 .wrp-03 ul{ padding-right:10%;}
.s3 .wrp-03 .wrp-img{ padding-left:0;}

.s3 .wrp-01{ margin-top:60px;}
.s3 .wrp-01,
.s3 .wrp-02,
.s3 .wrp-03,
.s3 .wrp-03 ul{ padding:0; height:auto; margin-bottom:60px; float:none;}
.s3 .wrp-03 .wrp-img{ position:relative; top:0; left:0; margin-bottom:10%; text-align:center;}

.s3 .wrp-01 ul{ float:none; margin:0; padding:0;}
/*.s3 .wrp-03 .wrp-img img.responsive-img{ width:85%;}*/
.s3 h3,
.s3 .wrp-02 p.jp{ font-size:16px !important; margin-bottom:30px !important;}
.s3 h3 span,
.s3 .wrp-01 p,
.s3 .wrp-02 p.jp,
.s3 .wrp-02 p.en,
.s3 .wrp-03 p{ text-align:left; font-size:13px !important;line-height:1.4em; letter-spacing:-0.04em;width:100%; padding-left:0;}
.s3 .wrp-02 p.en{ font-size:11px; letter-spacing:0.01em;}
.s3 .wrp-03 p{ letter-spacing:0.03em; }
.s3 .wrp-01 p span{ text-align:left; margin-right:0;}
.s3 .btn-more-detail a{ font-size:17px !important; float:right !important;}
.s3 .wrp-03 .wrp-img{ width:100%;}

.s3 .wrp-03 ul{ padding-top:10px;}

/* ****************************************************
 コンタクト .contact
***************************************************** */

.contact .form-group dt{ position:relative; width:100%; color:#FFFFFF; padding:0; margin:15px 0; font-size:13px;}
.form-control,textarea.form-control{ padding:10px;}

/* 送信ボタン
=========================================*/

.contact .form-group { width:100%;}
.contact .submit{ margin-bottom:60px;}

/* 確認画面
=========================================*/

.contact #contactF tbody tr th{ padding:10px;width:40%;}

}


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

/* メインビジュアル
=========================================*/
.main-visual{height:480px;}
.first-view .concept{ display:inline;}

}

/* ****************************************************
 シンプルスタイル01【h_s-style01】
***************************************************** */


@media screen and (max-width : 479px){
	.h_s-style01 .logo,
	.h_s-style01 .logo img{ 
		width:150px; height:70px;
	}
	.h_s-style01 .Navigation{ 
		-webkit-flex-direction: column;/* Safari */
		flex-direction: column;
		font-size:11px;
		margin:0;
	}	
	.h_s-style01 .Navigation li{
		margin-right:0;
	}
}

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

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