
/* ============= スマフォの場合 ========================================================================================== */

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

body .container {
	width: 100%;
	background: #FFF;
	margin: 0px auto;
	border: none;
	text-align:left;
	overflow: auto;
}
body .header {
	display:block;
	position: fixed;
	top:0; left:0;
	background: url(images/header_back1.jpg); 
	margin: 0px;
	padding: 0px;
	border-bottom: none;
	height:80px; width:100%;
	z-index:200;
}

body .header h1{
	display: inline;
	position: absolute;
	top:2px; right:2px;
	font-size:5px;
	color:#D6B47C;
	text-shadow:none;
} 
body .header h2{
	display: inline;
	position: absolute;
	bottom:1px; right:2px;
	font-size:5px;
	color: #D6B47C;
	text-shadow:none;
}

body .header .callme{
	display: none;
}

p.sp_title1{
	display: inline;
	position: absolute;
	top:22px; left:58px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho";
	font-size:35px;
	font-weight:bold; color:#D6B47C;
	text-shadow:#000 1px 1px;
}
 p.sp_title1 a{ text-decoration:none; }

/* スマフォヘッダー　検索、電話、Emailの3つのアイコン*/
span#search{ display:block; position: absolute; text-align:right; right:96px; top:22px;}
span#search img{ width:40px; height:auto; }
span#phone{ display:block; position: absolute; text-align:right; right:52px; top:22px;}
span#phone img{ width:40px; height:auto; }
span#email{ display:block; position: absolute; text-align:right; right:8px; top:22px;}
span#email img{ width:40px; height:auto; }

/* スマフォヘッダー　サイト内検索　入力用ウインドウ */
#search_window{ display:none;}	/* 初期状態では非表示(検索アイコンクリックで表示） */
#search_window li{
	display: block;
	position:fixed;
	background: url(images/header_back1.jpg);
	padding:20px 10px;
	width: 100%; height:auto; top:64px; left:0;
	z-index:10;
	text-align:right;
}
#search_window li form{ margin-right:0px;}

/* スマフォ時には、PCヘッダー用家紋亭ロゴクリッカブルマップ無効 */
.pc_map{ display:none;}


body .globalmenu { display:none; } 

body .content {
	background: #FFF;
	margin: 0px;
	padding: 0px;
	z-index:1;
}

body .content .side { display:none; }

body .content .main {
	display:block;
	position:relative;
	margin:65px 0 0 0;	/* 一般ページのような2カラム構成ページのコンテンツ領域をヘッダ下方へオフセットする量*/
	padding: 0px;
	float: right;
	width: 100%; display:block;
	text-align:left;
	background:#FFF;
	z-index:1;
}

/* 商品詳細ページのような1カラム構成ページのコンテンツ領域をヘッダ下方へオフセットする量*/
body .content>.umt-post{ padding-top:45px;}

/* スマフォ時トップページ:　スライダ上辺のオフセット量です。heightで調整します。　*/
body .main .sp_toppage_topbanner_offset{ display:block;  margin:0; padding:0; height:35px; width:auto;}


.clr { clear:both;}

.umt-post{ position:relative; display:block;  z-index:2;}

/* コンテンツブロックの背景 */
.umt-post.pc{ display: none;}
.umt-post.sp{ display: block;}



body .footer { 
	margin: 0px;
	padding: 0px;
	background:#FFF;
} 


#mainImage01,
#mainImage01 img{
	margin: 0 auto;
	height:auto;
	padding: 0 3px;
	width:100%;
}


/* ----　スマホメニュー　---- */

body .container .header #nav-drawer {
	display: block;
	position: absolute;
	top: 30px;
	left: 15px;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
    display: inline-block;
    width: 30px;
    height: 22px;
    vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
    position: absolute;
    height: 3px;/*線の太さ*/
    width: 25px;/*長さ*/
    border-radius: 3px;
    background: #555;
    display: block;
    content: '';
    cursor: pointer;
}
#nav-open span:before {
    bottom: -8px;
}
#nav-open span:after {
    bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
    display: none;	/*はじめは隠しておく*/
    position: fixed;
    top: 80px;			/*全体に広がるように*/
    left: 0;
    width: 100%;
    height: calc(100% - 80px);
    background: black;
    opacity: 0;
    transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
    overflow: auto;
    position: fixed;
    top: 80px;
    left: 0;
    z-index: 9999;		/*最前面に*/
    width: 70%;			/*右側に隙間を作る*/
    max-width: 330px;	/*最大幅*/
    height: 100%;
    background: #fff;	/*背景色*/
    transition: .3s ease-in-out;	/*滑らかに表示*/
    -webkit-transform: translateX(-105%);
    transform: translateX(-105%);	/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
	display: block;
    opacity: 0.5;
    z-index: 10;
    transition: .3s ease-in-out;
}

#nav-input:checked ~ #nav-content {
    -webkit-transform: translateX(0%);
    transform: translateX(0%)	;/*中身を表示*/
    box-shadow: 0 0 0 rgba(0,0,0,.15);
}


/* メニュー内容 */
#nav-content{
	background:url(images/header_back1.jpg);
	text-align:left;
}

.accordion{
	margin:0px;
	padding: 0px;
	text-align:left;
}

.accordion p + div {
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.3s ease-in;
  -moz-transition: height 0.3s ease-in;
  -o-transition: height 0.3s ease-in;
  -ms-transition: height 0.3s ease-in;
  transition: height 0.3s ease-in;
}
 
.accordion :target p + div {
  height: auto;
  padding:0px;
}
 
.accordion .section.large:target p + div {
  overflow: auto;
}
 
p.a-menu a{
  background: url(images/header_back1.png);
  padding: 14px;
  display: block;
  text-align:left;
  border-bottom:#fff solid 1px;
  color: #000;
  text-decoration: none;
}
 
.section p{
  margin-left: 0px;
}


.accordion :target ul{
	margin:0;
	padding:0;
}

.accordion :target ul li{
	margin:0px;
	padding:10px 25px;
	list-style: none;
	text-align:left;
	text-decoration:none;
	color:#000;
	border-bottom:#FFF 1px solid;
}
.accordion :target ul a{
	text-decoration:none;
	color:#000;
}
.accordion img.spmenu_icon{
	margin:0; padding:0;
	display: inline-block;
	width:36px; height:auto;
	vertical-align:middle;
	margin-right:20px;
}

.accordion .section ul li{ color:#900;} /* スマフォメニュ2階層目アイテム文字色*/



/*ul#search_window li{ padding:10px;}*/



body .footer { 
	margin: 5px;
	padding: 0px;
	background: url(images/header_back1.jpg);
} 

body .footer .footer-text{ 
	margin:0px auto;
	padding:20px;
	text-align:center;
}
body .footer .footer-text p,a{
	text-align:center;
	font-size:14px;
}



/* ==== トップページ　==== */

/* イメージバナー */
.umt-post img.banner{ display: none;}
.umt-post img.banner_sp{ display:block; margin: 10px 10px ; width:96%; height:auto;}
.umt-post .banner_sp_org{ display:block; text-align:center; margin: 10px 10px ; width:96%;}
.umt-post .banner_sp_org img{ width:100%;}


/* 当社について */

#topcontent4{ display:none;}
#topcontent4_sp{ display: block; margin-bottom:30px;}
#topcontent4_sp img.kaisha{ display: block; width:100%; height:auto;}
#topcontent4_sp img.shacho {width:20%; height:auto;float: left;margin-right:10px;}
#topcontent4_sp img.sign { margin-top:10px; padding-left:40px; width:100%; height:auto;}

/* 家紋額のご注文方法 */
.page_top_contents_chuumon_2.sp{ display: block; background:none; margin: 10px 0;}
.page_top_contents_chuumon_2.sp .block{ margin:0 0 10px 0;}
.page_top_contents_chuumon_2.sp .sp_title{ margin:5px 0 10px 0; padding:3px; width:100%; background:#eee; font-size:15px; font-weight:bold; text-align:left;}
.page_top_contents_chuumon_2.sp .block p.btn{ text-align:right;}

#top3content{ display:none;}
#top3content_sp{ display: block;}
.umt-postcontent#top3content_sp{ background:url(images/bg_okyakusamanokoe_sp.jpg) top left repeat; background-size:contain; }
#top3content_sp ul li{ font-size:13px;}
#top3content_sp p.btn{ text-align:right;}
#top3content_sp img {width:20%; height:auto;float:right;margin-right:10px;}

/* Swiper */
.swiper-slide.pc{ display: none;}
.swiper-slide.sp{ display: block;}



/* ==== 商品詳細ページ（１カラムページ）==== */

/* 最上部「ご先祖より脈々...」文章は表示残し、家紋額一覧ボタンとページめくりは非表示 */
.product_detail_header td.col1{ padding:10px; text-align:left;}
.product_detail_header td.col2,.product_detail_header td.col3{ display:none;}



/* ====== present/campaign ======= */
.present_campaign_ov
{
width:auto; min-height:160px;
background: none; 
}
.present_campaign_table .present_item_block
{
	display:inline-block; width:96%; margin:3px; background:#666; text-align:center; padding:10px 0;
}

.present_campaign_table2
{
margin:20px 10px; padding:5px 0; border:#Fff solid 1px; background: none; text-align:center;
}
.present_campaign_table .present_item_block2
{
	display:inline-block; width:45%; margin:3px; background:#666; text-align:center; padding:10px 0;
}
.present_campaign_table .present_item_block2 p{ text-align:center; width:100%; color:#FFF; margin:5px 0; }


/* 問合せフォーム */
.inq_form .left{ float: none; display:inline-block; width:100%;}
.inq_form .right{ float: none; display:inline-block; width:100%;}
.inq_form .clear{ clear:both; margin-bottom:20px;}
.inq_form input#name{ width:100%;}
.inq_form input#email{ width:100%;}
.inq_form label input#require_qa{ text-align:left}
.inq_form label input#require_pamphlet{ text-align:left}
.inq_form input#zip{ width:100%;}
.inq_form input#prefecture{ width:100%;}
.inq_form input#address{ width:100%;}
.inq_form input#phone{ width:100%;}
.inq_form input#kamon{ width:100%;}
.inq_form textarea#description{ width:100%; height:200px;}


/* 納期とお支払い */
.oshiharai_houhou_table .col2{ display:none;}
.oshiharai_houhou_table .col2sp {
	display:block;
	background:#eee;
	vertical-align:middle; text-align:center; margin-bottom:10px;
}


/* --- 注文方法 page (page008.html) --- */

.chuumon_houhou_pc{ display: none;}
.chuumon_houhou_sp{ display: block;}
.chuumon_houhou_sp .chuumon_houhou_btn{
    width: 126px;
    text-align: center;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_customer_1{
    background: url(images/bg_goriyougaido01sp.jpg) no-repeat;
    height: 378px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_company_1{
    background: url(images/bg_goriyougaido02sp.jpg) no-repeat;
    height: 378px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_customer_2{
    background: url(images/bg_goriyougaido03sp.jpg) no-repeat;
    height: 283px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_company_2{
    background: url(images/bg_goriyougaido04sp.jpg) no-repeat;
    height: 284px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_customer_3{
    background: url(images/bg_goriyougaido05sp.jpg) no-repeat;
    height: 183px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_company_3{
    background: url(images/bg_goriyougaido06sp.jpg) no-repeat;
    height: 583px;
    padding-top: 50px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_customer_4{
    background: url(images/bg_goriyougaido07sp.jpg) no-repeat;
    height: 460px;
    padding-top: 230px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
.chuumon_houhou_sp  .chuumon_houhou_comment_company_4{
    background: url(images/bg_goriyougaido08sp.jpg) no-repeat;
    height: 300px;
    padding-top: 85px;
    padding-right:15px;
    margin-top: 10px;
    width:300px;
  }
  
/* --- トップページ　Youtube動画　--- */
.blog_item2 .mvcap{ margin:10px; width:95%; height:auto; border:#CCC 1px solid; background:#fafafa; display: inline-block; position:relative;}
.blog_item2  iframe { width: 100%; }


/* -- 家紋名検索リスト -- */
p.caution, table.sagaku{ display:none;}	/* スマホの場合、家紋差額表tabel.sagakuは表示しない */
img.sagaku_sp{ margin:20px 0; width:100%; display:block;}	/* スマホの場合、家紋差額表の代わりにイメージの表img.sagaku_spを表示する */