/* =============================================================
  レスポンシブ
============================================================= */
/* 992px以上
----------------------------*/
@media (min-width: 992px){

	/* =============================================================
	  全ページ共通部分
	============================================================= */
	/*  ヘッダー
	-------------------------------------------*/
	.header_scrolled .site-header {
		box-shadow: none;
	}
	/*  グローバルナビゲーション
	-------------------------------------------*/
	/* 位置をセンター寄せに（lightning更新上書き）*/
	.site-header-container .global-nav--layout--float-right,
	.site-header-container .global-nav-list {
		margin: 0 auto;
	}
	/* 文字サイズを調整 */
	.global-nav-list>li .global-nav-name {
		font-size: 16px;
	}
	
	/*  コンテンツ
	-------------------------------------------*/
	/*  .site_body
	-------------------------------*/	
	/* padding調整 */
	.site-body {
		padding: 2rem 0 2.5rem; /* lightningの上書き */
	}
	/*  全幅背景
	-------------------------------*/
	.wide .block_inner {
		 max-width: 930px;
	}
	
	/*  フッター
	-------------------------------------------*/
	/* フッターコンテント内　ウィジェット
	--------------------------------*/
	/* 大枠
	---------------------*/
	/* 均等配置に変更*/
	.site-footer-content .row {
		justify-content: space-between;
	}
	/* 幅を変更 */
	.col-lg-4 {
		flex: 0 0 30%;
		max-width: 30%;
	}
	/* padding削除 */
	.site-footer-content .col-lg-4,
	.site-footer-content .col-md-6 {
		padding: 0;
	}
	/* widgetの下マージンなしに */
	.site-footer-content .widget {
		margin-bottom: 0;
	}
	
}/* 992px以上終わり */


/* 1200px以上
----------------------------*/
@media (min-width: 1200px){

	/* =============================================================
	  全ページ共通部分
	============================================================= */
	/*  ヘッダー
	-------------------------------------------*/
	/* 最大サイズを追加、左右のpadding削除*/
	.header_area {
		max-width: 1200px;
		align-items: center;
		padding-right: 0;
		padding-left: 0;
	}
	
	/*  コンテンツ
	-------------------------------------------*/
	/*  大枠
	-------------------------------*/
	/* 横幅1080px + padding左右15px */
	.container {
		max-width: 1200px;
	}
	/*  全幅背景
	-------------------------------*/
	/* 992px以上の打消しのため */
	.wide .block_inner {
		 max-width: 1080px;
	}
	
}/* 1200px以上終わり */



/* 991px以下
----------------------------*/
@media (max-width: 991px){

	/* =============================================================
	  全ページ共通部分
	============================================================= */
	/*  ヘッダー
	-------------------------------------------*/
	/*  大枠（lightning）
	--------------------------------*/
	/* 最大サイズ */
	.header_area {
		max-width: 720px;
		padding: 15px;
	}
	/* モバイルナビ
	--------------------------------*/
	/* 位置調整 */
	.admin-bar .vk-mobile-nav-menu-btn {
		border: none;
		top: calc(32px + 35px);
	}
	.vk-mobile-nav nav ul li a {
		padding-top: 1.5rem;
		padding-bottom: 1.6rem;
	}
	
	/*  ロゴ（lightningのもの）
	--------------------------------*/
	/* 既存のlogoを再表示 */
	.site-header--layout--nav-float .site-header-logo {
		display: block;
		background-color: #fff;
		background-color: var(--color-primary-bright1);
		margin-bottom: 0;
		padding-top: 0.8rem;
		padding-bottom: 0.7rem;
	}
	/*  ロゴなど（cmn.jsで追加したもの）
	-------------------------------*/
	/* 枠
	---------------------*/  
	/* 下線を追加 */
	.header_area {
		border-bottom: 1px solid var(--color-border1);
	}
	/* ロゴ（左）
	---------------------*/  
	/* 追加したlogoを非表示 */
	.header_area .left {
		display: none;
	}
	/* 電話、メール（右）
	---------------------*/  
	/* 横幅を100%に */
	.header_area .right {
		width: 80%;
		margin: 0 auto;
	}
	
	/*  コンテンツ
	-------------------------------------------*/
	/*  レイアウト
	--------------------------------*/
	/* コンテンツ幅 */
	.main-section {
		width: 100%;
	}
	/*  サイドバナー  .sub-section
	--------------------------------*/
	/* レイアウト
	---------------------*/     
	/* サイドバナー幅 */
	.sub-section--pos--left.sub-section {
		width: 100%;
		margin-top: 2.5rem;
	}
	/* リスト
	---------------------*/     
	.side_block li {
		width: calc((100% - 6%) / 3);
	}
	/* liを左寄せに */
	.side_block ul::before {
		content: "";
		display: block;
		width: calc((100% - 6%) / 3);
		order: 1;
	}
	.side_block ul::after {
		content: "";
		display: block;
		width: calc((100% - 6%) / 3);
	}
	
	/*  スマホ用ナビゲーション
	-------------------------------*/
	/* タブレットのメニューを縦並びに */
	.vk-menu-acc {
		display: block;
	}

	/*  その他
	-------------------------------------------*/
	/* コールトゥーアクション
	--------------------------------*/
	/* 共通
	---------------------*/
	/* calltoAction */
	.calltoAction {
		display: none;
	}
	
	/* =============================================================
	  トップページ　.top
	============================================================= */
	/* アバウト .about
	-------------------------------------------*/
	/* 左(人)
	----------------------------*/
	/* 幅 */
	.top .about li:first-child {
		width: 25%;
		position: relative;
	}
	.top .about li:first-child img {
		position: absolute;
		bottom: 0;
		width: 100%;
	}
	/* 右（文章）
	----------------------------*/
	/* 幅 */
	.top .about li:last-child {
		width: 72%;
		padding: 25px 25px 25px 0;
	}
	/* 見出し */
	.top .about li:last-child h2 br,
	.top .about li:last-child p br {
		display: none;
	}
	/* 小さなドロップ幕から大きな幕まで .pickup
	-------------------------------------------*/
	/* 見出し
	----------------------------*/
	/* h4のデザイン */
	.top .pickup h4 {
		width: 75%;
	}
	
	/* 生地 .cloth
	-------------------------------------------*/
	/* 見出し・文章
	----------------------------*/
	/* h5 */
	.top .cloth h5 {
		margin: 0;
	}
	/* h5 sppan */
	.top .cloth h5 span {
		display: block;
	}

	/* =============================================================
	  フォーム
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/*  テーブル
	----------------------------*/
	/*thとtdを縦並び、横100%に */
	.form table th,
	.form table td {
		display: block;
		width: 100%;
	}
	
} /* 991以下終わり */


/* 575px以下
----------------------------*/
@media (max-width: 575px) {

	/* =============================================================
	  全ページ共通部分
	============================================================= */
	/*  ページ全体
	-------------------------------------------*/
	.site-body {
		padding-top: 0;
	}
	
	/*  ヘッダー
	-------------------------------------------*/
	/*  ロゴなど（cmn.jsで追加したもの）
	-------------------------------*/	
	/* ロゴ（左）
	---------------------*/  
	/* 画像サイズを縮小 */
	.site-header--layout--nav-float .site-header-logo img {
		width: 68%;
	}
	/* 枠
	---------------------*/  
	/* 上に線を追加 */
	.header_area {
		border-top: 1px solid var(--color-border1);
		padding: ;
	}
	/* 電話、メール（右）
	---------------------*/  
	/* 横幅を100%に */
	.header_area .right {
		display: block;
		width: 80%;
		text-align: center;
	}
	.header_area .right .tel {
		width: 100%;
	}
	.header_area .right .contact {
		width: 75%;
		margin: 1rem auto 0;
	}
	
	/* mobileナビ
	----------------------------*/	
	/* 枠を非表示 */
	.admin-bar .vk-mobile-nav-menu-btn {
		top: calc(32px);
	}	
	.vk-mobile-nav-menu-btn.menu-open {
		border: none;	
	}
	
	/*  グローバルナビゲーション
	-------------------------------------------*/
	/* ulのflexを解除 */
	ul.vk-menu-acc {
		display: block;
	}
	
	/* ページタイトル（トップ以外）
	-------------------------------------------*/
	.page-header-title, h1.page-header-title {
		width: 100%;
		text-align: center;
	}
	
	/* スマホPC切り替え
	-------------------------------------------*/
	/* sp用表示pc用非表示 */
	.sp {
		display: block;
	}
	.pc {
		display: none;
	}
	
	/*  コンテンツ
	-------------------------------------------*/
	/*  サイドバナー  .sub-section
	--------------------------------*/
	/* リスト
	---------------------*/
	.block {
		margin-top: 3rem;
	}
	/* ulの幅を変更 */
	.side_block ul, .side_block .widget ul {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	/* liの幅を変更 */
	.side_block li {
		width: calc((100% - 6%) / 2);
	}
	/*  見出し
	--------------------------------*/
	/* h2（ページヘッダー）の文字サイズ変更 */
	h2 {
		font-size: 1.7rem;
	}
	/* h3の文字サイズ変更 */
	h3 {
		font-size: 1.5rem;
	}
	
	/* ボタン
	--------------------------------*/
	/* コンテンツボタン .btn_base
	----------------------*/
	/* ガイドボタン .cmn_guide_btn
	----------------------*/
	/* アンカー */
	 a.cmn_guide_btn {
		width: 80%;
		padding-top: 0.9rem;
	}
	
	/*  フッター
	-------------------------------------------*/
	/* フッターコンテント内　ウィジェット
	--------------------------------*/
	/* 配送について、お問い合わせ先（中） #block-8
	---------------------*/
	/* footer_lawをセンター寄せに */
	.site-footer-content .widget .footer_law {
		text-align: center;
	}
	
	/* =============================================================
	  トップページ　.top
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* block_inner */
	.top .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
		margin-top: 1.5rem;
	}
	
	/* メインビジュアル .mvisual
	-------------------------------------------*/
	/* テキスト
	----------------------------*/
	.top .block.mvisual {
		margin-top: 0;
	}
	
	/* アバウト .about
	-------------------------------------------*/
	/* 全体
	----------------------------*/
	/* 背景 */
	.top .about {
		border-radius: 0;
	}
	/* 左(人)
	----------------------------*/
	/* 幅 */
	.top .about li:first-child {
		display: none;
	}
	/* 右（文章）
	----------------------------*/
	/* 幅 */
	.top .about li:last-child {
		width: 100%;
		padding: 35px 30px;
	}
	
	/* 小さなドロップ幕から大きな幕まで .pickup
	-------------------------------------------*/
	/* 見出し
	----------------------------*/
	/* h4のデザイン */
	.top .pickup h4 {
		font-size: 1.3rem;
	}

	/* 生地 .cloth
	-------------------------------------------*/
	/* アイコン
	----------------------------*/
	/* アイコンの幅とデザイン */
	.top .cloth li li {
		width: 100%;
	}
	

	/* 定番サイズと価格 .price
	-------------------------------------------*/
	/* テーブル
	----------------------------*/
	/* テーブルのスクロール（スマホ対策） */
	.top .price .table_wrap {
		overflow: auto;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
	}
	.top .price .table_wrap + .sp {
		margin-top: 0.5rem;
	}

	/* =============================================================
	  ご注文の流れ　.orderflow
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* block_inner */
	.orderflow .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
		margin-top: 1.5rem;
	}
	/*  ボタン
	--------------------------------*/
	/* マージン */
	.orderflow .grad_btn {
		width: 80%;
	}
	
	/* =============================================================
	  送料・お支払い　.payment
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.payment .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	/* 支払い方法　.method
	-------------------------------------------*/
	/*  サブブロック
	--------------------------------*/
	/* 注釈 */
	.payment .method .bank {
		font-size: 1.1rem;
	}
	
	
	/* =============================================================
	  よくある質問　.faq
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.faq .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	
	/* =============================================================
	  用語集　.glossary
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.glossary .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	
	/* ===================================================
	  デザイン案の作成・送付について .rough-design
	=================================================== */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.rough-design .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	/* 送付方法　.send
	-------------------------------------------*/
	/* 見出し・文章
	-----------------------------*/
	/* tit_group */
	.rough-design .tit_group {
		display: flex;
		flex-flow: row wrap;	justify-content: space-between;

	}
	/* 一行目のみ縦中央寄せ */
	.rough-design .send .sub_block:nth-of-type(1) .tit_group {
		align-items: start;
	}
	/* p */
	.rough-design .tit_group p {
		width: 10.8%;
	}
		/* p */
	.rough-design .tit_group h4 {
		width: 86%;
	}
		
	/* =============================================================
	  お客様の声　.customers_voice
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* 大枠
	--------------------------------*/
	/* block_inner */
	.customers_voice .block_inner {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
	}
	/* voice */
	.customers_voice .voice {
		width: 100%;
	}
	
	/* =============================================================
	  フォーム　.form
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* form */
	.form .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	/* margin調整 */
	.form .block_inner + .block {
		margin-top: 1rem;
	}
	/* テキストボックス
	--------------------------------*/
	/* 入力欄 */
	input[type=date], input[type=email], input[type=number], input[type=password], input[type=tel], input[type=text], input[type=url], select, textarea {
		font-size: 16px; /* 勝手に拡大防止 */
	}
	/* 送信ボタン
	--------------------------------*/
	/* submitの幅を変更 */
	input[type=submit] {
		width: 80%;
	}
	
	/* =============================================================
	  入稿データ作成ガイド　.guide
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* block_inner */
	.guide .block_inner {
		width: 90%;
		margin-top: 1rem;
		margin-right: auto;
		margin-left: auto;
	}
	
	/* =============================================================
	  プライバポリシー　.privacy-policy
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.privacy-policy .block_inner {
		width: 95%;
		margin-top: 1rem;
		margin-right: auto;
		margin-left: auto;
	}
	
	/* =============================================================
	  特定商取引法に基づく表示　.law
	============================================================= */
	/* 共通
	-------------------------------------------*/
	/* ブロック
	--------------------------------*/
	/* 幅の変更 */
	.law .block_inner {
		width: 95%;
		margin-right: auto;
		margin-left: auto;
	}
	
	
}/* 575px以下終わり */