@charset "utf-8";

/* ===========================================================
 * 
 * 古川浩市　スタイルシート
 * Last UpDate : 2024/12/10
 *
=========================================================== */

/* ----------------------------------------------------------
	style.css

	index
	 1 - ページ共通css
	 2 - リンクの色
	 3 - 見出し
	 4 - 背景
	 5 - レイアウト
	 6 - ヘッダー
	 7 - フッター
	 8 - グローバルナビゲーションgNavi
	 9 - ローカルナビゲーションlNavi
	10 - コンテンツ

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

/* ----------------------------------------------------------
 1 - ページ共通css
---------------------------------------------------------- */
@import "normalize.css";
@import "general.css";

html,body{ height:100%; }
html {
	font-family: "a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho",serif;
    overflow: auto;
}
body {
    overflow-x: hidden;
}

a:hover img{
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity:0.6;
}
a img {
	-webkit-transition: 0.4s ease-in-out;
	-moz-transition: 0.4s ease-in-out;
	-o-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out;
}

/* SP&TAB用 */
.SP		{ display:none; }
.TAB	{ display:none; }
.PC		{ display:block; }

/* ----------------------------------------------------------
 2 - リンクの色
---------------------------------------------------------- */

a:link		{ color:#666; text-decoration:underline; }
a:visited	{ color:#666; text-decoration:underline; }
a:hover		{ color:#9f3b42; text-decoration:none; }
a:active	{ color:#9f3b42; text-decoration:none; }


/* ----------------------------------------------------------
 3 - 見出し
---------------------------------------------------------- */

header h1		{  }
header h1 a:hover img{
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity:0.6;
}

h2{ font-size:52px; text-align:center; letter-spacing:2px; line-height:0.5; color:#66262c; padding:30px 0 50px 0; border-bottom:1px solid #9f3b42; margin:0 0 80px 0; }
h2 span{ font-size:11px; }

h3{ font-size:37px; color:#9f3b42; text-align:center; margin:30px 0 60px 0; }
h3 span{ font-size:24px; }

h4{ width:500px; font-size:46px; color:#9f3b42; text-align:center; letter-spacing:2px; border-bottom:2px solid #9f3b42; margin:0 auto 80px auto; }

h5{ font-size: 30px; color:#9f3b42; padding: 5px 15px; letter-spacing:2px; margin-bottom: 40px;  background: #eee; }
h5 span{ font-size: 20px; }

/* ----------------------------------------------------------
 4 - 背景
---------------------------------------------------------- */


/* ----------------------------------------------------------
 5 - レイアウト
---------------------------------------------------------- */

#wrapper {
	width: 100%;
	position: relative;
	height: auto !important;
	height: 100%;
	min-height: 100%;
}


/* ----------------------------------------------------------
 6 - ヘッダー
---------------------------------------------------------- */

header {
	background:#9f3b42;
	height:110px;
}
header #header{
	width: 1180px;
	height:110px;
	margin: 0 auto;
}
header #header:after{
	content: "";
	display: block;
	clear: both;
}
header .headerSec{
	height:110px;
	position: relative;
}
header .headerLogo{
	float: left;
	width: 330px;
	position:absolute;
	top: 50%;
	margin-top:-35px;/* 画像の高さの半分 */
}
header .headerContact{
	float:right;
	width:60px;
	position:absolute;
	right:0;
	top: 50%;
	margin-top:-30px;/* 画像の高さの半分 */
}
header .headerContact a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:60px;
	color:#fff;
	font-size:30px;
	font-weight:bold;
	background: #66262c;
	text-decoration:none;
}
header .headerContact a:hover {
	color:#66262c;
	background-color:#fff;
}
header .headerContact a{
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

/* ----------------------------------------------------------
 7 - フッター
---------------------------------------------------------- */

footer {
	overflow:hidden;
	background:#66262c;
	padding-bottom:80px;
}
footer:after{
	content:"";
	display:block;
	clear:both;
}
footer #footer{
	height:100px;
}
footer .footerCopyright{
	color:#fff;
	font-size:10px;
	text-align:center;
	line-height:100px;
}

/* ----------------------------------------------------------
 8 - グローバルナビゲーションgNavi
---------------------------------------------------------- */

#gNavi{
	position: fixed;
	bottom: 0;
	width: 100%;
	background:url(../images/bg_gnavi01.png) repeat-x;
	height:80px;
}
#gNavi:after{
	content:"";
	display:block;
	clear:both;
}
#gNavi nav{
	width:1180px;
	margin:0 auto;
}
#gNavi ul { display: flex; justify-content: space-around; }
#gNavi ul:after {
	content: "";
	display: block;
	clear: both;
}
#gNavi li {
	/* float:left;
	width:12.5%; */
	text-align:center;
	font-size:16px;
	font-weight:bold;
	letter-spacing:1px;
}
#gNavi li a {
	display: block;
	padding:31px 0 30px 0;
	color:#fff;
	background:none;
	text-decoration:none;
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#gNavi li a:hover,#gNavi li .active {
	opacity:0.6;
}
#gNavi li i {
	margin-left:5px;
	font-size:14px;
}
/*
#gNavi nav.gNavi02 ul li:nth-child(1){ width: 13%; }
#gNavi nav.gNavi02 ul li:nth-child(2){ width: 13%; }
#gNavi nav.gNavi02 ul li:nth-child(3){ width: 8%; }
#gNavi nav.gNavi02 ul li:nth-child(4){ width: 9%; }
#gNavi nav.gNavi02 ul li:nth-child(5){ width: 9%; }
#gNavi nav.gNavi02 ul li:nth-child(6){ width: 14%; }
#gNavi nav.gNavi02 ul li:nth-child(7){ width: 9%; }
#gNavi nav.gNavi02 ul li:nth-child(9){ width: 25%; }
*/


/* ----------------------------------------------------------
 9 - ローカルナビゲーションlNavi
---------------------------------------------------------- */


/* ----------------------------------------------------------
 10 - コンテンツ
---------------------------------------------------------- */

#contents {
	width: 1180px;
	margin: 0 auto 160px auto;
}
#contents:after {
	content: "";
	display: block;
	clear: both;
}

/* パンクズ */
#breadcrumbs{
	font-size:0.8em;
	padding:10px 0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#breadcrumbs:after{
	content:"";
	display:block;
	clear:both;
}

#breadcrumbs ol.breadcrumb {
	width:1180px;
	margin:0 auto;
	list-style-type: none;
}
#breadcrumbs ol.breadcrumb li {
	display: inline;
	margin-right:5px;
}
#breadcrumbs ol.breadcrumb li::before {
	content: '\00bb';
	margin-right:10px;
	color:#333;
}
#breadcrumbs ol.breadcrumb li:first-child:before {
	content: '';
}

#breadcrumbs a {
	text-decoration: none;
	color: #333;
}

#breadcrumbs a:hover {
	text-decoration: none;
	font-weight: normal;
	color: #999;
	opacity:0.6;
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#main{
	float:right;
	width:800px;
}

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

#topImgWrap{
}
#topImg{
	position:relative;
	width:1250px;
	margin:0 auto;
}
#topImg .topName{
	position:absolute;
	top:30px;
	left:80px;
	z-index:999;
}
#topImg .topContact{
	position:absolute;
	top:30px;
	left:1155px;
	width:60px;
	z-index:999;
}
#topImg .topContact a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:60px;
	color:#fff;
	font-size:30px;
	font-weight:bold;
	background: #66262c;
	text-decoration:none;
}
#topImg .topContact a:hover {
	color:#66262c;
	background-color:#fff;
}
#topImg .topContact a {
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#contents .topSec01{
	overflow:hidden;
	margin-top:30px;
}
#contents .topSec01Tit{
	float:left;
	width:380px;
	color:#9f3a41;
	font-size:40px;
	font-weight:bold;
	line-height:1.1;
	letter-spacing:1px;
	margin-top:10px;
	margin-left:20px;
	margin-right:90px;
}
#contents .topSec01Tit span{
	font-size:16px;

}
#contents .topSec01Txt{
	float:left;
	width:690px;
	font-size:15px;
	line-height:1.7;
	font-weight:bold;
}
#contents .topSec02{
	overflow:hidden;
	margin-top:60px;
	margin-bottom:70px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec02BtnWrap{
	overflow:hidden;
	margin-right:-20px;
	margin-bottom:70px;
}
#contents .topSec02Btn{
	float:left;
	width:280px;
	margin-right:20px;
}

#contents .topSec03{
	margin-top:60px;
	margin-bottom:70px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec03Wrap{
	overflow:hidden;
	margin-right:-20px;
	margin-bottom:70px;
}
#contents .topSec03Btn{
	float:left;
	width:380px;
	margin-right:20px;
}
#contents .topSec03Btn i{
	margin-left:10px;
	font-size:19px;
}
#contents .topSec03Btn a {
	display:block;
	text-align:center;
	color:#fff;
	font-size:23px;
	padding:30px 0;
	font-weight:bold;
	background: #9f3a41;
	border:1px solid #9f3a41;
	text-decoration:none;
}
#contents .topSec03Btn a:hover {
	color:#9f3a41;
	background-color:#fff;
}
#contents .topSec03Btn a {
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#contents .topSec01:after,
#contents .topSec02:after,
#contents .topSec03:after,
#contents .topSec04:after{
	content:"";
	display:block;
	clear:both;
}

#contents .topSec04{
	overflow:hidden;
	margin-bottom:80px;
}
#contents .topSec04News{
	float:left;
	width:685px;
	margin-right:20px;
}
#contents .topSec04NewsTit{
	font-size:26px;
	letter-spacing:2px;
	color:#9f3a41;
	margin-bottom:10px;
}
#contents .topSec04News01Wrap{
	padding:30px;
	border:1px solid #9f3a41;
	height:400px;
	overflow-y:scroll;
}
#contents .topSec04News01{
	overflow:hidden;
	border-bottom:1px solid #ccc;
	padding:15px 0;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .topSec04News01Date{
	float:left;
	width:90px;
	font-size:13px;
	color:#9f3a41;
	margin-right:25px;
}
#contents .topSec04News01Tit{
	float:left;
	width:490px;
	font-size:16px;
}
#contents .topSec04News01Tit a{
	text-decoration:none;
}
#contents .topSec04FB{
	float:left;
	width:475px;
}
#contents .topSec04FBTit{
	font-size:26px;
	letter-spacing:2px;
	color:#3b5998;
	margin-bottom:10px;
}
#contents .topSec04FB01{
}

#contents .topSecProducts{ background: #f5f5f5; overflow: hidden; padding: 0 500%; margin: 50px -500%; }
#contents .topSecProducts01{ width: 1100px; margin: 50px auto; border: 2px solid #5b2567; overflow: hidden; }
#contents .topSecProductsTit{ background: #5b2567; color: #fff; text-align: center; font-size: 30px; letter-spacing: 1px; padding: 10px; }
#contents .topSecProducts02{ background: #e7dfe8; overflow: hidden; }
#contents .topSecProducts02Tit{ color: #5a2566; font-size: 28px; text-align: center; letter-spacing: 1px; padding: 15px 0; }
#contents .topSecProducts02Line{ display: block; text-align: center; border-bottom: 5px dotted #5a2566; width: 25px; margin: 0 auto; }
#contents .topSecProducts02Txt{ font-size: 15px; text-align: center; padding: 15px; }
#contents .topSecProducts03{ overflow: hidden; padding: 30px 0; background: #fff; }
#contents .topSecProducts03 ul{ width: 990px; margin: 0 auto; }
#contents .topSecProducts03 ul li{ float: left; width: 320px; margin-right: 15px; }
#contents .topSecProducts03 ul li:nth-child(3n){ margin-right: 0; }
#contents .topSecProducts03 ul li .topSecProducts03Img{ text-align: center; margin-bottom: 10px; }
#contents .topSecProducts03 ul li .topSecProducts03Tit{ width: 180px; font-size: 18px; letter-spacing: 1px; border: 2px solid #5b2567; border-radius: 25px; padding: 5px 10px; text-align: center; margin: 0 auto; margin-bottom: 10px; }
#contents .topSecProducts03 ul li ul{ width: 285px; margin: 0 auto; overflow: hidden; }
#contents .topSecProducts03 ul li ul li{ float: left; width: 49%; margin-right: 2%; }
#contents .topSecProducts03 ul li ul li:last-child{ margin-right: 0; }
#contents .topSecProducts03 ul li ul li a{ display: block; color: #fff; font-size: 16px; padding: 10px 5px; text-align: center; text-decoration: none; }
#contents .topSecProducts03 ul li ul li:first-child a{ background: #9f3940; border: 2px solid #9f3940; }
#contents .topSecProducts03 ul li ul li:first-child a:hover{ color: #9f3940; background: #fff; }
#contents .topSecProducts03 ul li ul li:last-child a{ background: #66262c; border: 2px solid #66262c; }
#contents .topSecProducts03 ul li ul li:last-child a:hover{ color: #66262c; background: #fff; }

#contents .topSecProducts04{ overflow: hidden; padding: 30px 0; background: #fff; }
#contents .topSecProducts04 ul{ width: 94%; margin: 0 auto; display: flex; justify-content: space-between; }
#contents .topSecProducts04 ul li{ flex-basis: 48%; }
#contents .topSecProducts04 ul li img{ width: 100%; height: auto; }
#contents .topSecProducts04 ul li .topSecProducts04Img{ text-align: center; }
#contents .topSecProducts04 ul li .topSecProducts04Tit{ width: 180px; font-size: 18px; letter-spacing: 1px; border: 2px solid #5b2567; border-radius: 25px; padding: 5px 10px; text-align: center; margin: 0 auto; margin-bottom: 10px; }
#contents .topSecProducts04 ul li ul{ width: 100%; margin: 0 auto; overflow: hidden; }
#contents .topSecProducts04 ul li ul li{ margin: 0 auto; }
#contents .topSecProducts04 ul li ul li a{ display: block; color: #fff; font-size: 16px; padding: 10px 5px; text-align: center; text-decoration: none; }
#contents .topSecProducts04 ul li ul li:first-child a{ background: #9f3940; border: 2px solid #9f3940; }
#contents .topSecProducts04 ul li ul li:first-child a:hover{ color: #9f3940; background: #fff; }

.topSecProducts04Tit{ text-align: center; font-size: 30px; letter-spacing: 10px; font-weight: bold; margin-bottom: 30px;  }

.topSecProducts05{ background: #fff; padding: 0 0 30px 0; }
.topSecProducts05 ul{ width: 94%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.topSecProducts05 li{ flex-basis: 24%; margin-bottom: 20px; }
.topSecProducts05 li img{ width: 100%; height: auto; }


.top_products01{ padding: 30px 0; }
.top_products01_tit{ text-align: center; font-size: 30px; letter-spacing: 10px; font-weight: bold; margin-bottom: 30px;  }
.top_products01_list{ width: 94%; max-width: 650px; margin: 0 auto; display: flex; justify-content: space-between; }
.top_products01_item:nth-child(1){ flex-basis: 66.5%; }
.top_products01_item:nth-child(2){ flex-basis: 32.5%; }
.top_products01 img{ width: 100%; height: auto; }
.top_products01_img01{}
.top_products01_img01 ul{}
.top_products01_img01 ul li{ margin-bottom: 10px; }



/************** 吉川浩市とは about **************/

#contents .aboutSec,#contents .pickySec{
	overflow:hidden;
	width:1140px;
	padding:0 20px;
	margin-bottom:80px;
}
#contents .aboutSec:after,,#contents .pickySec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .aboutSecTxt{
	float:left;
	width:710px;
	margin-right:35px;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
}
#contents .aboutSecTxt dl dt{
	display: block;
	width: 20%;
	clear: left;
	float: left;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecTxt dl dd{
	display: block;
	width: 80%;
	float: left;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecImg{
	float:left;
	width:395px;
}
#contents .aboutSec01Wrap{
	overflow:hidden;
	margin-right:-40px;
}
#contents .aboutSec01{
	float:left;
	width:550px;
	margin-right:40px;
	margin-bottom:20px;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSec01Date{
	background:#9f3a41;
	display:inline-block;
	color:#fff;
	font-size:14px;
	padding:5px 20px;
	margin:0 10px;
}
#contents .aboutSec01Txt{
	padding:15px 10px;
	border-bottom:1px solid #ccc;
}

/************** 我が師 master **************/
#contents .masterSecTxt{
	float:left;
	width:805px;
	margin-right:35px;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .masterSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
}
#contents .masterSecTxt dl dt{
	display: block;
	width: 20%;
	clear: left;
	float: left;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .masterSecTxt dl dd{
	display: block;
	width: 80%;
	float: left;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .masterSecImg{
	float:left;
	width:300px;
}

/************** こだわり picky **************/
#contents .pickySec h3{
	width:1140px;
}
#contents .pickySec h3 .h3Tit01{
	width:120px;
	font-size:18px;
	font-weight:normal;
	color:#fff;
	background:#66262c;
	text-align:center;
	padding:5px 0;
	margin:0 auto 10px auto;
}
#contents .pickySec h3 .h3Tit02{
	width:230px;
	font-size:46px;
	color:#9f3a41;
	border-bottom:2px solid #9f3a41;
	text-align:center;
	padding:0 30px;
	margin:0 auto;
}

#contents .pickySec01{
	overflow:hidden;
	margin-bottom:80px;
}
#contents .pickySec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .pickySec01Txt{
	float:left;
	width:700px;
	margin-right:50px;
	font-size:17px;
	line-height:1.7;
}
#contents .pickySec01Img{
	float:left;
	width:390px;
}

/************** オーダーメイド ordermade **************/
#contents .ordermadeSec01{
	overflow:hidden;
	width:600px;
	margin:0 auto;
}
#contents .ordermadeSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .ordermadeSec01Img{
	float:left;
	width:280px;
	margin-right:20px;
	text-align:center;
}
#contents .ordermadeSec01Img img{
	margin-bottom:10px;
}
#contents .ordermadeSec01Img span{
	font-size:15px;
}
#contents .ordermadeSec01Txt{
	margin:60px 0;
	text-align:center;
	font-size:17px;
	line-height:1.7;
}
#contents .ordermadeSec02Txt{
	margin:0 0 60px 0;
	text-align:center;
	font-size:24px;
	line-height:1.8;
}
#contents .ordermadeSec02Txt span{
	font-size:17px;
}

#contents .ordermadeSec03Wrap{
}
#contents .ordermadeSec03{
	float:left;
	width:46%;
	margin:0 auto;
	text-align:center;
}
#contents .ordermadeSec03Img{
	margin-bottom:30px;
}
#contents .ordermadeSec03Tit{
	font-size:26px;
	color:#66262c;
	letter-spacing:1px;
	margin-bottom:30px;
}
#contents .ordermadeSec03Txt{
	font-size:14px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	padding:0 30px;
}
#contents .flowSec01{
}
#contents .flowSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .flowSec01Ico{
	float:left;
	width:160px;
	height:160px;
	text-align:center;
	-webkit-border-radius: 50%;/* width,heightの半分 */
	-moz-border-radius: 50%;
	border-radius: 50%;
	background:#9f3940;
	margin-right:40px;
}
#contents .flowSec01Ico img{
	position: relative;
	top:50%;
	transform: translateY(-50%);
}
#contents .flowSec01Txt{
	float:left;
	width:940px;
}
#contents .flowSec01Tit01{
	font-size:26px;
	color:#66262c;
	margin-bottom:20px;
}
#contents .flowSec01Txt01{
	font-size:15px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .flowSec01Txt01 span{
	font-weight:bold;
	font-size:21px;
	margin-top:5px;
}
#contents .flowSec01Btn{
	margin-top:20px;
	width:250px;
}
#contents .flowSec01Btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:40px;
	color:#fff;
	font-size:16px;
	background: #66262c;
	border:1px solid #66262c;
	border-radius:3px;
	text-decoration:none;
}
#contents .flowSec01Btn a:hover {
	color:#66262c;
	background-color:#fff;
}
#contents .flowSec01Btn a{
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#contents .flowSec01Btn i{
	margin-right:10px;
}
#contents .flowSec01Arrow{
	text-align:center;
	margin:80px 0;
}

/************** 工房情報 access **************/
#contents .accessSec{
	overflow:hidden;
	width:1180px;
	margin-bottom:80px;
}
#contents .accessSec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .accessSec dl{
	width: 100%;
	overflow:hidden;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	margin-bottom:40px;
}
#contents .accessSec dl dt{
	display: block;
	width: 15%;
	float: left;
	border-top:1px solid #fff;
	color:#fff;
	background:#9f3940;
	font-size:17px;
	padding:20px;
}
#contents .accessSec dl dd{
	display: block;
	width: 35%;
	float: left;
	border-top:1px solid #fff;
	background:#f5ebec;
	font-size:17px;
	padding:20px;
}
#contents .accessSec01Map{
	margin-top:60px;
}

/************** 作品紹介 works **************/

.worksNav{ width: 60%; margin: 0 auto 60px auto; }
.worksNav > ul{ display: flex; justify-content: center; }
.worksNav > ul > li{ flex: 1 0 auto; margin: 0 2%; }
.worksNav > ul > li a{ display: block; color: #9f3b42; font-size: 18px; border: 1px solid #9f3b42; text-align: center; padding: 10px; text-decoration: none; }
.worksNav > ul > li a:hover{ background: #9f3b42; color: #fff; }

.worksNav01{ width: 60%; margin: 0 auto 60px auto; }
.worksNav01 > ul{ display: flex; justify-content: center; }
.worksNav01 > ul > li{ flex: 1 0 auto; margin: 0 2%; }
.worksNav01 > ul > li a{ display: block; color: #9f3b42; font-size: 16px; border: 1px solid #9f3b42; border-radius: 30px; text-align: center; padding: 10px 15px; text-decoration: none; }
.worksNav01 > ul > li a span{ font-size: 12px; }
.worksNav01 > ul > li a:hover{ background: #9f3b42; color: #fff; }


#contents .worksSec{
	overflow:hidden;
	width:1180px;
	margin-bottom:160px;
}
#contents .worksSec:after{
	content:"";
	display:block;
	clear:both;
}
/*
#contents .worksSec01Wrap{
	overflow:hidden;
	margin-right:-20px;
}
#contents .worksSec01{
	float:left;
	width:280px;
	margin-right:20px;
	margin-bottom:60px;
	text-align:center;
}
*/

#contents .worksSec01Wrap{
}
#contents .worksSec01{
	position:relative;
	overflow:hidden;
}
#contents .worksSec01 ul {
	position:relative;
	left:50%;
	float:left;
}
#contents .worksSec01 ul li {
	position:relative;
	left:-50%;
	float:left;
	text-align:center;
	margin-left:20px;
	margin-bottom:40px;
}
#contents .worksSec01 ul li:first-child,
#contents .worksSec01 ul li:nth-child(5),
#contents .worksSec01 ul li:nth-child(9),
#contents .worksSec01 ul li:nth-child(13),
#contents .worksSec01 ul li:nth-child(17),
#contents .worksSec01 ul li:nth-child(21),
#contents .worksSec01 ul li:nth-child(25),
#contents .worksSec01 ul li:nth-child(29) {

    margin-left:0;
}

#contents .worksSec01Img{
	margin-bottom:10px;
}
#contents .worksSec01Tit{
	font-size:16px;
	letter-spacing:1px;
}

dl.gallery-item{
	margin-bottom:40px;
}
dt.gallery-icon{
	margin-bottom:10px;
}
dd.gallery-caption{
	font-size:15px;
}


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------SPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSP
 SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
SPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSPSP ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
@media screen and (max-width:640px){

.PC{ display:none; }
.SP{ display: block; }

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

html{ overflow: auto; }
body{
    overflow-x: hidden;
}

/* ----------------------------------------------------------
 3 - 見出し SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

header h1		{ width:100%; }
header h1 a:hover img{
	opacity: 1 !important;
	filter: alpha(opacity=100) !important;
	-moz-opacity:1 !important;
}

h2{ font-size:39px; text-align:center; letter-spacing:2px; line-height:0.5; color:#66262c; padding:30px 0 30px 0; border-bottom:1px solid #9f3b42; margin:0 0 30px 0; }
h2 span{ font-size:11px; }

h3{ font-size:30px; color:#9f3b42; text-align:center; margin:10px 0 20px 0; }
h3 span{ font-size:20px; }

h4{ width:100%; font-size:30px; color:#9f3b42; text-align:center; letter-spacing:2px; border-bottom:2px solid #9f3b42; margin:0 auto 30px auto; }

h5{ font-size: 20px; }
h5 span{ display: block; font-size: 15px; }

/* ----------------------------------------------------------
 6 - ヘッダー SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

header {
	background:#9f3b42;
	height:auto;
}
header #header{
	width: 100%;
	height:auto;
	margin: 0 auto;
}
header #header:after{
	content: "";
	display: block;
	clear: both;
}
header .headerSec{
	height:auto;
	position:static;
}
header .headerLogo{
	float:none;
	width:100%;
	position:static;
	top: auto;
	margin-top:auto;
	margin-left:auto;
	margin-right:auto;
}
header .headerLogo h1{
	width:60%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
header .headerContact{
	display:none;
}

/* ----------------------------------------------------------
 7 - フッター SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

footer {
	overflow:hidden;
	background:#66262c;
	padding-bottom:0;
}
footer:after{
	content:"";
	display:block;
	clear:both;
}
footer #footer{
	height:auto;
}
footer .footerCopyright{
	color:#fff;
	font-size:10px;
	text-align:center;
	line-height:3;
}

/* ----------------------------------------------------------
 8 - グローバルナビゲーションgNavi SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

#gNavi{
	display:none;
}

/* ----------------------------------------------------------
 9 - ローカルナビゲーションlNavi SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

/* ----------------------------------------------------------
 10 - コンテンツ SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS
---------------------------------------------------------- */

#contents {
	width:94%;
	margin: 0 auto;
}
#breadcrumbs{
	display:none;
}
#main{
	float:none;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

/************** トップページ SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS SP CSS **************/

#topImgWrap{
	width:100%;
	height:auto;
	margin:0 auto 10px auto;
}
#topImg{
	position:relative;
	width:100%;
	height:auto;
}
#topImg .topName{
	display:none;
}
#topImg .topContact{
	display:none;
}

#contents .topSec01{
	overflow:hidden;
	margin-top:10px;
}
#contents .topSec01Tit{
	float:none;
	width:100%;
	color:#9f3a41;
	font-size:30px;
	font-weight:bold;
	line-height:1.1;
	letter-spacing:1px;
	margin-top:10px;
	margin-left:10px;
	margin-right:0;
	margin-bottom:5px;
}
#contents .topSec01Tit span{
	font-size:16px;
}
#contents .topSec01Txt{
	float:none;
	width:100%;
	font-size:15px;
	line-height:1.7;
	font-weight:bold;
}
#contents .topSec02{
	overflow:hidden;
	margin-top:30px;
	margin-bottom:30px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec02BtnWrap{
	overflow:hidden;
	margin-right:-4%;
	margin-bottom:30px;
}
#contents .topSec02Btn{
	float:left;
	width:46%;
	margin-right:4%;
	margin-bottom:4%;
}

#contents .topSec03{
	margin-top:30px;
	margin-bottom:30px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec03Wrap{
	overflow:hidden;
	margin-right:0;
	margin-bottom:30px;
}
#contents .topSec03Btn{
	float:none;
	width:100%;
	margin-bottom:4%;
}
#contents .topSec03Btn a {
	display:block;
	text-align:center;
	color:#fff;
	font-size:23px;
	padding:30px 0;
	font-weight:bold;
	background: #9f3a41;
	border:1px solid #9f3a41;
	text-decoration:none;
}
#contents .topSec03Btn a:hover {
	color:#9f3a41;
	background-color:#fff;
}
#contents .topSec03Btn a {
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#contents .topSec01:after,
#contents .topSec02:after,
#contents .topSec03:after,
#contents .topSec04:after{
	content:"";
	display:block;
	clear:both;
}

#contents .topSec04{
	overflow:hidden;
	margin-bottom:30px;
}
#contents .topSec04News{
	float:none;
	width:100%;
	margin-right:0;
	margin-bottom:20px;
}
#contents .topSec04NewsTit{
	font-size:26px;
	letter-spacing:2px;
	color:#9f3a41;
	margin-bottom:10px;
	text-align:center;
}
#contents .topSec04News01Wrap{
	padding:20px;
	border:1px solid #9f3a41;
	height:auto;
	overflow-y:auto;
}
#contents .topSec04News01{
	overflow:hidden;
	border-bottom:1px solid #ccc;
	padding:15px 0;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .topSec04News01Date{
	float:none;
	width:100%;
	font-size:13px;
	color:#9f3a41;
	margin-right:25px;
}
#contents .topSec04News01Tit{
	float:none;
	width:100%;
	font-size:16px;
}
#contents .topSec04News01Tit a{
	text-decoration:none;
}
#contents .topSec04FB{
	float:none;
	width:100%;
}
#contents .topSec04FBTit{
	font-size:26px;
	letter-spacing:2px;
	color:#3b5998;
	margin-bottom:10px;
	text-align:center;
}
#contents .topSec04FB01{
}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
  width: 100% !important;
}

#contents .topSecProducts{ background: #f5f5f5; overflow: hidden; padding: 0 500%; margin: 50px -500%; }
#contents .topSecProducts01{ width: 94%; margin: 50px auto; border: 2px solid #5b2567; overflow: hidden; }
#contents .topSecProductsTit{ background: #5b2567; color: #fff; text-align: center; font-size: 25px; letter-spacing: 1px; padding: 10px; }
#contents .topSecProducts02{ background: #e7dfe8; overflow: hidden; padding: 10px; }
#contents .topSecProducts02Tit{ color: #5a2566; font-size: 20px; text-align: center; letter-spacing: 1px; padding: 15px 0; }
#contents .topSecProducts02Line{ display: block; text-align: center; border-bottom: 5px dotted #5a2566; width: 25px; margin: 0 auto; }
#contents .topSecProducts02Txt{ font-size: 14px; text-align: center; padding: 15px 0; }
#contents .topSecProducts03{ overflow: hidden; padding: 30px 0; background: #fff; }
#contents .topSecProducts03 ul{ width: 90%; margin: 0 auto; }
#contents .topSecProducts03 ul li{ float: none; width: 100%; margin-right: 0; margin-bottom: 20px; }
#contents .topSecProducts03 ul li:nth-child(3n){ margin-right: 0; }
#contents .topSecProducts03 ul li .topSecProducts03Img{ text-align: center; margin-bottom: 10px; }
#contents .topSecProducts03 ul li .topSecProducts03Tit{ width: 180px; font-size: 18px; letter-spacing: 1px; border: 2px solid #5b2567; border-radius: 25px; padding: 5px 10px; text-align: center; margin: 0 auto; margin-bottom: 10px; }
#contents .topSecProducts03 ul li ul{ width: 285px; margin: 0 auto; overflow: hidden; }
#contents .topSecProducts03 ul li ul li{ float: left; width: 49%; margin-right: 2%; }
#contents .topSecProducts03 ul li ul li:last-child{ margin-right: 0; }
#contents .topSecProducts03 ul li ul li a{ display: block; color: #fff; font-size: 16px; padding: 10px 5px; text-align: center; text-decoration: none; }
#contents .topSecProducts03 ul li ul li:first-child a{ background: #9f3940; border: 2px solid #9f3940; }
#contents .topSecProducts03 ul li ul li:first-child a:hover{ color: #9f3940; background: #fff; }
#contents .topSecProducts03 ul li ul li:last-child a{ background: #66262c; border: 2px solid #66262c; }
#contents .topSecProducts03 ul li ul li:last-child a:hover{ color: #66262c; background: #fff; }




.topSecProducts05{ background: #fff; padding: 0 0 30px 0; }
.topSecProducts05 ul{ width: 94%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.topSecProducts05 li{ flex-basis: 48%; margin-bottom: 20px; }
.topSecProducts05 li img{ width: 100%; height: auto; }



.top_products01{ padding: 30px 0; }
.top_products01_tit{ text-align: center; font-size: 30px; letter-spacing: 10px; font-weight: bold; margin-bottom: 30px;  }
.top_products01_list{ width: 94%; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.top_products01_item:nth-child(1){ flex-basis: 100%; margin-bottom: 10px; }
.top_products01_item:nth-child(2){ flex-basis: 100%; }
.top_products01 img{ width: 100%; height: auto; }
.top_products01_img01{}
.top_products01_img01 ul{}
.top_products01_img01 ul li{ margin-bottom: 10px; }



/************** 吉川浩市とは about **************/

#contents .aboutSec,#contents .pickySec{
	overflow:hidden;
	width:96%;
	padding:0 2%;
	margin-bottom:40px;
}
#contents .aboutSec:after,,#contents .pickySec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .aboutSecTxt{
	float:none;
	width:100%;
	margin-right:0;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
	margin-bottom:20px;
}
#contents .aboutSecTxt dl dt{
	display: block;
	width: 100%;
	clear: left;
	float: none;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecTxt dl dd{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecImg{
	float:none;
	width:100%;
	text-align:center;
}
#contents .aboutSec01Wrap{
	overflow:hidden;
	margin-right:0;
}
#contents .aboutSec01{
	float:none;
	width:100%;
	margin-right:0;
	margin-bottom:20px;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSec01Date{
	background:#9f3a41;
	display:inline-block;
	color:#fff;
	font-size:14px;
	padding:5px 20px;
	margin:0 10px;
}
#contents .aboutSec01Txt{
	padding:15px 10px;
	border-bottom:1px solid #ccc;
}

/************** 我が師 master **************/
#contents .masterSecTxt{
	float:none;
	width:100%;
	margin-right:0;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .masterSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
	margin-bottom:20px;
}
#contents .masterSecTxt dl dt{
	display: block;
	width: 100%;
	clear: left;
	float: none;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .masterSecTxt dl dd{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .masterSecImg{
	float:none;
	width:100%;
	text-align:center;
}

/************** こだわり picky **************/
#contents .pickySec h3{
	width:100%;
}
#contents .pickySec h3 .h3Tit01{
	width:120px;
	font-size:18px;
	font-weight:normal;
	color:#fff;
	background:#66262c;
	text-align:center;
	padding:5px 0;
	margin:0 auto 10px auto;
}
#contents .pickySec h3 .h3Tit02{
	width:230px;
	font-size:46px;
	color:#9f3a41;
	border-bottom:2px solid #9f3a41;
	text-align:center;
	padding:0 30px;
	margin:0 auto;
}

#contents .pickySec01{
	overflow:hidden;
	margin-bottom:80px;
}
#contents .pickySec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .pickySec01Txt{
	float:none;
	width:100%;
	margin-right:0;
	font-size:17px;
	line-height:1.7;
	margin-bottom:20px;
}
#contents .pickySec01Img{
	float:none;
	width:100%;
	text-align:center;
}

/************** オーダーメイド ordermade **************/
#contents .ordermadeSec01{
	overflow:hidden;
	width:100%;
	margin:0 auto;
}
#contents .ordermadeSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .ordermadeSec01Img{
	float:none;
	width:100%;
	margin-right:auto;
	text-align:center;
	margin-left:auto;
}
#contents .ordermadeSec01Img img{
	margin-bottom:10px;
}
#contents .ordermadeSec01Img span{
	font-size:15px;
}
#contents .ordermadeSec01Txt{
	margin:60px 0;
	text-align:center;
	font-size:17px;
	line-height:1.7;
}
#contents .ordermadeSec02Txt{
	margin:0 0 60px 0;
	text-align:center;
	font-size:24px;
	line-height:1.8;
}
#contents .ordermadeSec02Txt span{
	font-size:17px;
}

#contents .ordermadeSec03Wrap{
}
#contents .ordermadeSec03{
	float:none;
	width:100%;
	margin:0 auto;
	text-align:center;
}
#contents .ordermadeSec03Img{
	margin-bottom:30px;
}
#contents .ordermadeSec03Tit{
	font-size:26px;
	color:#66262c;
	letter-spacing:1px;
	margin-bottom:30px;
}
#contents .ordermadeSec03Txt{
	font-size:14px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	padding:0 30px;
	margin-bottom:60px;
}
#contents .flowSec01{
}
#contents .flowSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .flowSec01Ico{
	float:none;
	width:100px;
	height:100px;
	text-align:center;
	-webkit-border-radius: 50%;/* width,heightの半分 */
	-moz-border-radius: 50%;
	border-radius: 50%;
	background:#9f3940;
	margin-right:auto;
	margin-left:auto;
}
#contents .flowSec01Ico img{
	position: relative;
	top:50%;
	transform: translateY(-50%);
}
#contents .flowSec01Txt{
	float:none;
	width:100%;
}
#contents .flowSec01Tit01{
	font-size:26px;
	color:#66262c;
	margin-bottom:10px;
	text-align:center;
}
#contents .flowSec01Txt01{
	font-size:15px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .flowSec01Txt01 span{
	font-weight:bold;
	font-size:21px;
	margin-top:5px;
}
#contents .flowSec01Btn{
	margin-top:20px;
	width:250px;
	margin-left:auto;
	margin-right:auto;
}
#contents .flowSec01Btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:40px;
	color:#fff;
	font-size:16px;
	background: #66262c;
	border:1px solid #66262c;
	border-radius:3px;
	text-decoration:none;
}
#contents .flowSec01Btn a:hover {
	color:#66262c;
	background-color:#fff;
}
#contents .flowSec01Btn a{
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#contents .flowSec01Btn i{
	margin-right:10px;
}
#contents .flowSec01Arrow{
	text-align:center;
	margin:0px 0;
}

/************** 工房情報 access **************/
#contents .accessSec{
	overflow:hidden;
	width:100%;
	margin-bottom:40px;
}
#contents .accessSec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .accessSec dl{
	width: 100%;
	overflow:hidden;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	margin-bottom:40px;
}
#contents .accessSec dl dt{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #fff;
	color:#fff;
	background:#9f3940;
	font-size:17px;
	padding:20px;
}
#contents .accessSec dl dd{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #fff;
	background:#f5ebec;
	font-size:17px;
	padding:20px;
}
#contents .accessSec01Map{
	margin-top:60px;
}

#contents .accessSec01Map {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
#contents .accessSec01Map iframe,
#contents .accessSec01Map object,
#contents .accessSec01Map embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/************** 作品紹介 works **************/
.worksNav{ width: 80%; margin: 0 auto 60px auto; }

#contents .worksSec{
	overflow:hidden;
	width:100%;
	margin-bottom:60px;
}
#contents .worksSec:after{
	content:"";
	display:block;
	clear:both;
}
/*
#contents .worksSec01Wrap{
	overflow:hidden;
	margin-right:0;
}
#contents .worksSec01{
	float:left;
	width:100%;
	margin-right:0;
	margin-bottom:60px;
	text-align:center;
}
*/
#contents .worksSec01Wrap{
}
#contents .worksSec01{
}
#contents .worksSec01 ul {
	position:inherit;
	left:0;
	float:none;
}
#contents .worksSec01 ul li {
	position:inherit;
	left:0;
	float:none;
	text-align:center;
	margin-left:0;
	width:100%;
	margin-bottom:40px;
}






#contents .worksSec01Img{
	margin-bottom:10px;
	text-align:center;
}
#contents .worksSec01Tit{
	font-size:16px;
	letter-spacing:1px;
}

dl.gallery-item{
	margin-bottom:40px;
}
dt.gallery-icon{
	margin-bottom:10px;
}
dd.gallery-caption{
	font-size:15px;
}


.worksNav01{ width: 60%; margin: 0 auto 60px auto; }
.worksNav01 > ul{ display: flex; justify-content: center; }
.worksNav01 > ul > li{ flex: 1 0 auto; margin: 0 2%; }
.worksNav01 > ul > li a{ display: block; color: #9f3b42; font-size: 14px; border: 1px solid #9f3b42; border-radius: 30px; text-align: center; padding: 5px 10px; text-decoration: none; }
.worksNav01 > ul > li a span{ display: none; }
.worksNav01 > ul > li a:hover{ background: #9f3b42; color: #fff; }


}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ TABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTAB
 TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
TABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTABTAB ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
@media screen and (min-width:641px) and (max-width:1024px){

.PC{ display:none; }
.TAB{ display:block; }

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

html{  }
body{
}

i.navicon{font-style:normal;}

/* ----------------------------------------------------------
 3 - 見出し TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

header h1		{ width:100%; }
header h1 a:hover img{
	opacity: 1 !important;
	filter: alpha(opacity=100) !important;
	-moz-opacity:1 !important;
}

h2{ font-size:39px; text-align:center; letter-spacing:2px; line-height:0.5; color:#66262c; padding:30px 0 30px 0; border-bottom:1px solid #9f3b42; margin:0 0 30px 0; }
h2 span{ font-size:11px; }

h3{ font-size:30px; color:#9f3b42; text-align:center; margin:10px 0 20px 0; }
h3 span{ font-size:20px; }

h4{ width:500px; font-size:46px; color:#9f3b42; text-align:center; letter-spacing:2px; border-bottom:2px solid #9f3b42; margin:0 auto 80px auto; }


/* ----------------------------------------------------------
 6 - ヘッダー TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

header {
	background:#9f3b42;
	height:auto;
}
header #header{
	width: 100%;
	height:auto;
	margin: 0 auto;
}
header #header:after{
	content: "";
	display: block;
	clear: both;
}
header .headerSec{
	height:auto;
	position:static;
}
header .headerLogo{
	float:none;
	width:100%;
	position:static;
	top: auto;
	margin-top:auto;
	margin-left:auto;
	margin-right:auto;
}
header .headerLogo h1{
	width:40%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
header .headerContact{
	display:none;
}

/* ----------------------------------------------------------
 7 - フッター TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

footer {
	overflow:hidden;
	background:#66262c;
	padding-bottom:0;
}
footer:after{
	content:"";
	display:block;
	clear:both;
}
footer #footer{
	height:auto;
}
footer .footerCopyright{
	color:#fff;
	font-size:10px;
	text-align:center;
	line-height:3;
}

/* ----------------------------------------------------------
 8 - グローバルナビゲーションgNavi TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

#gNavi{
	display:none;
}

/* ----------------------------------------- -----------------
 9 - ローカルナビゲーションlNavi TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

/* ----------------------------------------------------------
 10 - コンテンツ TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS
---------------------------------------------------------- */

#contents {
	width:90%;
	margin: 0 auto;
}
#breadcrumbs{
	display:none;
}
#main{
	float:none;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}


/************** トップページ TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS TAB CSS **************/

#topImgWrap{
	width:100%;
	height:auto;
	margin:0 auto 10px auto;
}
#topImg{
	position:relative;
	width:100%;
	height:auto;
}
#topImg .topName{
	display:none;
}
#topImg .topContact{
	display:none;
}

#contents .topSec01{
	overflow:hidden;
	margin-top:10px;
}
#contents .topSec01Tit{
	float:none;
	width:100%;
	color:#9f3a41;
	font-size:40px;
	font-weight:bold;
	line-height:1.1;
	letter-spacing:1px;
	margin-top:10px;
	margin-left:0px;
	margin-right:0;
	margin-bottom:5px;
}
#contents .topSec01Tit span{
	font-size:16px;
}
#contents .topSec01Txt{
	float:none;
	width:100%;
	font-size:15px;
	line-height:1.7;
	font-weight:bold;
}
#contents .topSec02{
	overflow:hidden;
	margin-top:30px;
	margin-bottom:30px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec02BtnWrap{
	overflow:hidden;
	margin-right:-2%;
	margin-bottom:30px;
}
#contents .topSec02Btn{
	float:left;
	width:23%;
	margin-right:2%;
	margin-bottom:4%;
}

#contents .topSec03{
	margin-top:30px;
	margin-bottom:30px;
	border-bottom:1px solid #9f3a41;
}
#contents .topSec03Wrap{
	overflow:hidden;
	margin-right:0;
	margin-bottom:30px;
}
#contents .topSec03Btn{
	float:none;
	width:100%;
	margin-bottom:4%;
}
#contents .topSec03Btn a {
	display:block;
	text-align:center;
	color:#fff;
	font-size:23px;
	padding:30px 0;
	font-weight:bold;
	background: #9f3a41;
	border:1px solid #9f3a41;
	text-decoration:none;
}
#contents .topSec03Btn a:hover {
	color:#9f3a41;
	background-color:#fff;
}
#contents .topSec03Btn a {
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}

#contents .topSec01:after,
#contents .topSec02:after,
#contents .topSec03:after,
#contents .topSec04:after{
	content:"";
	display:block;
	clear:both;
}

#contents .topSec04{
	overflow:hidden;
	margin-bottom:30px;
}
#contents .topSec04News{
	float:none;
	width:100%;
	margin-right:0;
	margin-bottom:20px;
}
#contents .topSec04NewsTit{
	font-size:26px;
	letter-spacing:2px;
	color:#9f3a41;
	margin-bottom:10px;
	text-align:center;
}
#contents .topSec04News01Wrap{
	padding:20px;
	border:1px solid #9f3a41;
	height:auto;
	overflow-y:auto;
}
#contents .topSec04News01{
	overflow:hidden;
	border-bottom:1px solid #ccc;
	padding:15px 0;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .topSec04News01Date{
	float:none;
	width:100%;
	font-size:13px;
	color:#9f3a41;
	margin-right:25px;
}
#contents .topSec04News01Tit{
	float:none;
	width:100%;
	font-size:16px;
}
#contents .topSec04News01Tit a{
	text-decoration:none;
}
#contents .topSec04FB{
	float:none;
	width:60%;
	margin-left:auto;
	margin-right:auto;
}
#contents .topSec04FBTit{
	font-size:26px;
	letter-spacing:2px;
	color:#3b5998;
	margin-bottom:10px;
	text-align:center;
}
#contents .topSec04FB01{
	margin-left:auto;
	margin-right:auto;
}
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
  width: 100% !important;
}

#contents .topSecProducts{ background: #f5f5f5; overflow: hidden; padding: 0 500%; margin: 50px -500%; }
#contents .topSecProducts01{ width: 100%; margin: 50px auto; border: 2px solid #5b2567; overflow: hidden; }
#contents .topSecProductsTit{ background: #5b2567; color: #fff; text-align: center; font-size: 30px; letter-spacing: 1px; padding: 10px; }
#contents .topSecProducts02{ background: #e7dfe8; overflow: hidden; padding: 10px; }
#contents .topSecProducts02Tit{ color: #5a2566; font-size: 28px; text-align: center; letter-spacing: 1px; padding: 15px 0; }
#contents .topSecProducts02Line{ display: block; text-align: center; border-bottom: 5px dotted #5a2566; width: 25px; margin: 0 auto; }
#contents .topSecProducts02Txt{ font-size: 15px; text-align: center; padding: 15px 0; }
#contents .topSecProducts03{ overflow: hidden; padding: 30px 0; background: #fff; }
#contents .topSecProducts03 ul{ width: 94%; margin: 0 auto; }
#contents .topSecProducts03 ul li{ float: left; width: 32%; margin-right: 1%; }
#contents .topSecProducts03 ul li:nth-child(3n){ margin-right: 0; }
#contents .topSecProducts03 ul li .topSecProducts03Img{ text-align: center; margin-bottom: 10px; }
#contents .topSecProducts03 ul li .topSecProducts03Tit{ width: 180px; font-size: 18px; letter-spacing: 1px; border: 2px solid #5b2567; border-radius: 25px; padding: 5px 10px; text-align: center; margin: 0 auto; margin-bottom: 10px; }
#contents .topSecProducts03 ul li ul{ width: 100%; margin: 0 auto; overflow: hidden; }
#contents .topSecProducts03 ul li ul li{ float: left; width: 49%; margin-right: 2%; }
#contents .topSecProducts03 ul li ul li:last-child{ margin-right: 0; }
#contents .topSecProducts03 ul li ul li a{ display: block; color: #fff; font-size: 16px; padding: 10px 5px; text-align: center; text-decoration: none; }
#contents .topSecProducts03 ul li ul li:first-child a{ background: #9f3940; border: 2px solid #9f3940; }
#contents .topSecProducts03 ul li ul li:first-child a:hover{ color: #9f3940; background: #fff; }
#contents .topSecProducts03 ul li ul li:last-child a{ background: #66262c; border: 2px solid #66262c; }
#contents .topSecProducts03 ul li ul li:last-child a:hover{ color: #66262c; background: #fff; }


/************** 吉川浩市とは about **************/

#contents .aboutSec,#contents .pickySec{
	overflow:hidden;
	width:96%;
	padding:0 2%;
	margin-bottom:30px;
}
#contents .aboutSec:after,,#contents .pickySec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .aboutSecTxt{
	float:left;
	width:60%;
	margin-right:3%;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
}
#contents .aboutSecTxt dl dt{
	display: block;
	width: 20%;
	clear: left;
	float: left;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecTxt dl dd{
	display: block;
	width: 80%;
	float: left;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .aboutSecImg{
	float:left;
	width:37%;
	text-align:center;
}
#contents .aboutSec01Wrap{
	overflow:hidden;
	margin-right:-4%;
}
#contents .aboutSec01{
	float:left;
	width:46%;
	margin-right:4%;
	margin-bottom:20px;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .aboutSec01Date{
	background:#9f3a41;
	display:inline-block;
	color:#fff;
	font-size:14px;
	padding:5px 20px;
	margin:0 10px;
}
#contents .aboutSec01Txt{
	padding:15px 10px;
	border-bottom:1px solid #ccc;
}

/************** 我が師 master **************/
#contents .masterSecTxt{
	float:left;
	width:65%;
	margin-right:3%;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .masterSecTxt dl{
	width: 100%;
	overflow:hidden;
	border-bottom:1px solid #ccc;
}
#contents .masterSecTxt dl dt{
	display: block;
	width: 20%;
	clear: left;
	float: left;
	border-top:1px solid #ccc;
	color:#9f3a41;
	font-size:14px;
	padding:10px;
}
#contents .masterSecTxt dl dd{
	display: block;
	width: 80%;
	float: left;
	border-top:1px solid #ccc;
	font-size:14px;
	padding:10px;
}
#contents .masterSecImg{
	float:left;
	width:32%;
	text-align:center;
}

/************** こだわり picky **************/
#contents .pickySec h3{
	width:100%;
}
#contents .pickySec h3 .h3Tit01{
	width:120px;
	font-size:18px;
	font-weight:normal;
	color:#fff;
	background:#66262c;
	text-align:center;
	padding:5px 0;
	margin:0 auto 10px auto;
}
#contents .pickySec h3 .h3Tit02{
	width:230px;
	font-size:46px;
	color:#9f3a41;
	border-bottom:2px solid #9f3a41;
	text-align:center;
	padding:0 30px;
	margin:0 auto;
}

#contents .pickySec01{
	overflow:hidden;
	margin-bottom:80px;
}
#contents .pickySec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .pickySec01Txt{
	float:left;
	width:60%;
	margin-right:3%;
	font-size:17px;
	line-height:1.7;
}
#contents .pickySec01Img{
	float:left;
	width:37%;
	text-align:center;
}

/************** オーダーメイド ordermade **************/
#contents .ordermadeSec01{
	overflow:hidden;
	width:600px;
	margin:0 auto;
}
#contents .ordermadeSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .ordermadeSec01Img{
	float:left;
	width:280px;
	margin-right:20px;
	text-align:center;
}
#contents .ordermadeSec01Img img{
	margin-bottom:10px;
}
#contents .ordermadeSec01Img span{
	font-size:15px;
}
#contents .ordermadeSec01Txt{
	margin:60px 0;
	text-align:center;
	font-size:17px;
	line-height:1.7;
}
#contents .ordermadeSec02Txt{
	margin:0 0 60px 0;
	text-align:center;
	font-size:24px;
	line-height:1.8;
}
#contents .ordermadeSec02Txt span{
	font-size:17px;
}

#contents .ordermadeSec03Wrap{
}
#contents .ordermadeSec03{
	float:left;
	width:46%;
	margin:0 2%;
	text-align:center;
}
#contents .ordermadeSec03Img{
	margin-bottom:30px;
}
#contents .ordermadeSec03Tit{
	font-size:26px;
	color:#66262c;
	letter-spacing:1px;
	margin-bottom:30px;
}
#contents .ordermadeSec03Txt{
	font-size:14px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	padding:0 30px;
}
#contents .flowSec01{
}
#contents .flowSec01:after{
	content:"";
	display:block;
	clear:both;
}
#contents .flowSec01Ico{
	float:left;
	width:110px;
	height:110px;
	text-align:center;
	-webkit-border-radius: 50%;/* width,heightの半分 */
	-moz-border-radius: 50%;
	border-radius: 50%;
	background:#9f3940;
	margin-right:40px;
}
#contents .flowSec01Ico img{
	position: relative;
	top:50%;
	transform: translateY(-50%);
}
#contents .flowSec01Txt{
	float:left;
	width:70%;
}
#contents .flowSec01Tit01{
	font-size:26px;
	color:#66262c;
	margin-bottom:20px;
}
#contents .flowSec01Txt01{
	font-size:15px;
	line-height:1.6;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#contents .flowSec01Txt01 span{
	font-weight:bold;
	font-size:21px;
	margin-top:5px;
}
#contents .flowSec01Btn{
	margin-top:20px;
	width:250px;
}
#contents .flowSec01Btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:40px;
	color:#fff;
	font-size:16px;
	background: #66262c;
	border:1px solid #66262c;
	border-radius:3px;
	text-decoration:none;
}
#contents .flowSec01Btn a:hover {
	color:#66262c;
	background-color:#fff;
}
#contents .flowSec01Btn a{
	-ms-filter: "alpha( opacity=60 )";
	-webkit-transition: 0.5s ease-in-out;
	-moz-transition: 0.5s ease-in-out;
	-o-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out;
}
#contents .flowSec01Btn i{
	margin-right:10px;
}
#contents .flowSec01Arrow{
	text-align:center;
	margin:60px 0;
}

/************** 工房情報 access **************/
#contents .accessSec{
	overflow:hidden;
	width:100%;
	margin-bottom:40px;
}
#contents .accessSec:after{
	content:"";
	display:block;
	clear:both;
}
#contents .accessSec dl{
	width: 100%;
	overflow:hidden;
	font-family:"a-otf-ryumin-pr6n","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	margin-bottom:40px;
}
#contents .accessSec dl dt{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #fff;
	color:#fff;
	background:#9f3940;
	font-size:17px;
	padding:20px;
}
#contents .accessSec dl dd{
	display: block;
	width: 100%;
	float: none;
	border-top:1px solid #fff;
	background:#f5ebec;
	font-size:17px;
	padding:20px;
}



.accessSec .topSec03Wrap{
	overflow:hidden;
	margin-right:0;
	margin-bottom:30px;
}
.accessSec .topSec03Btn{
	float:left !important;
	width:31% !important;
	margin-left:1% !important;
	margin-right:1% !important;
	margin-bottom:4% !important;
}

#contents .accessSec01Map{
	margin-top:60px;
}

#contents .accessSec01Map {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
#contents .accessSec01Map iframe,
#contents .accessSec01Map object,
#contents .accessSec01Map embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/************** 作品紹介 works **************/
#contents .worksSec{
	overflow:hidden;
	width:100%;
	margin-bottom:160px;
}
#contents .worksSec:after{
	content:"";
	display:block;
	clear:both;
}
/*
#contents .worksSec01Wrap{
	overflow:hidden;
	margin-right:-2%;
}
#contents .worksSec01{
	float:left;
	width:48%;
	margin-right:2%;
	margin-bottom:60px;
	text-align:center;
}
*/
#contents .worksSec01Wrap{
}
#contents .worksSec01{
}
#contents .worksSec01 ul {
	position:inherit;
	left:0;
	float:none;
}
#contents .worksSec01 ul li {
	position:inherit;
	left:0;
	float:left;
	text-align:center;
	margin-left:2%;
	width:48%;
	margin-bottom:60px;
}
#contents .worksSec01 ul li:nth-child(odd) {
    margin-left:0;
}

#contents .worksSec01Img{
	margin-bottom:10px;
	text-align:center;
}
#contents .worksSec01Tit{
	font-size:16px;
	letter-spacing:1px;
}

dl.gallery-item{
	margin-bottom:40px;
}
dt.gallery-icon{
	margin-bottom:10px;
}
dd.gallery-caption{
	font-size:15px;
}


}
