@charset "utf-8";

body.index_body{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 500;
	/*font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;*/
	color:#000;
	background-color:#f9f2ef;
	background-image:url(../img/bg_line.svg);
	background-position:center top;
	background-size:2300px auto;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
body.lower_body{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 500;
	/*font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;*/
	color:#000;
	background-color:#f9f2ef;
	background-image:url(../img/bg_line2.svg);
	background-position:center top;
	background-size:2300px auto;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
b, strong, .bold{
	font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;
}
_:lang(x)::-ms-backdrop, .selector {
	font-family: "Segoe UI", Meiryo, sans-serif;
}

@keyframes fadeIn {
	0% {opacity: 0}
	100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
	0% {opacity: 0}
	100% {opacity: 1}
}
a {
	color:#000;
}


/*ハンバーガーメニュー*/
nav.NavMenu{
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	background: rgba(255,165,40,0.9);
	color: #fff;
	font-size:1.5em;
	line-height:0.76em;
	text-align: center;/*テキストを中央揃え*/
	width: 100%;	/*全幅表示*/
	height: 100vh;	/*全幅表示*/
	transform: translateX(100%);	/*ナビを上に隠す*/
	transition: all 0.3s;	/*アニメーションの時間を指定*/
}
nav.NavMenu ul{
	/*background: #fff;*/
	width: 100%;	
	margin: 0 auto;
	padding: 0;
}
nav.NavMenu ul li{
	font-size: 1.0em;
	list-style-type: none;
	padding: 0;
	width: 100%;
	/*border-bottom: 1px dotted #888;*/
}
nav.NavMenu ul li:first-child{
	padding-top: 7%;
	padding-bottom: 28px;
}
nav.NavMenu ul li:last-child{
	padding-bottom: 0;
	border-bottom: none;	/*最後のメニュー項目のみ下線を消す*/
}
#navi_sns{
	text-align:center;
	margin-top:50px;
}
#navi_insata{
	width:30px;
}
#navi_fb{
	width:30px;
	margin:0 20px;
}
#navi_youtube{
	width:30px;
	margin:3px 0;
}

nav.NavMenu ul li a{
	display: block;/*クリックできる領域を広げる*/
	color: #fff;
	padding: 1em 0;
	text-decoration:none;
}
nav.NavMenu ul li a:hover{
	color: #666;
}
nav.NavMenu.active{
	transform: translateY(0%);/*ナビを表示する*/
}

.Toggle {
	display: block;
	position: fixed;	/* bodyに対しての絶対位置指定 */
	right: 30px;
	top: 30px;
	width: 70px;
	height: 70px;
	cursor: pointer;
	z-index: 3;
	background-image:url(../img/humberger_bg.svg);
	background-size:cover;
	background-position:center center;
	-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
	-moz-transition: .35s ease-in-out;/*変化の速度を指定*/
	transition: .35s ease-in-out;	/*変化の速度を指定*/
}
.Toggle span {
	display: block;
	position: absolute;
	width: 30px;
	border-bottom: solid 3px #fff;
	-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
	-moz-transition: .35s ease-in-out;/*変化の速度を指定*/
	transition: .35s ease-in-out;	/*変化の速度を指定*/
	left: 20px;
}
.Toggle span:nth-child(1) {
	top: 24px;
}
.Toggle span:nth-child(2) {
	top: 33px;
}
.Toggle span:nth-child(3) {
	top: 43px;
}

.Toggle.active {
	display: block;
	position: fixed;	/* bodyに対しての絶対位置指定 */
	right: 30px;
	top: 30px;
	width: 70px;
	height: 70px;
	cursor: pointer;
	z-index: 3;
	background-image:url(../img/humberger_bg2.svg);
	background-size:cover;
	background-position:center center;
	-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
	-moz-transition: .35s ease-in-out;/*変化の速度を指定*/
	transition: .35s ease-in-out;	/*変化の速度を指定*/
}
 
/* 最初のspanをマイナス45度に */
.Toggle.active span:nth-child(1) {
	top: 33px;
	left: 20px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
	top: 33px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}


header{
	position:absolute;
	top:0;
	float:left;
	width:100%;
	margin-bottom:42px;
}
#logo{
	clear:both;
	float:left;
	padding:30px;
	width:250px;
	z-index:99;
}
#logo img{
	width:100%;
}
#totop{
	position:fixed;
	right:30px;
	bottom:30px;
	width:100px;
}
.wrapp1200{
	width:1200px;
	margin:0 auto;
}
.wrapp1000{
	clear:both;
	position:relative;
	width:1000px;
	margin:0 auto;
}
#slider_wrapp{
	position:relative;
	width:97%;
	margin:150px 1.5% 0;
	padding:0;
}
#slider_wrapp li img{
	width:100%;
}


/*写真フェードイン*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

#illust01{
	position:absolute;
	bottom:3%;
	left:0;
	width:28.5%;
}
#headcopy_wrapp{
	position:relative;
	background-image:url(../img/headcopy_bg.svg);
	background-size:contain;
	background-position:bottom center;
	width:95%;
	height:650px;
	margin:0 2.5%;
}
#headcopy{
	position:relative;
	float:left;
	left:90px;
	width:19.1%;
}
#headcopy_txt{
	position:absolute;
	top:29%;
	right:15%;
	width:600px;
}
#headcopy_txt01{
	font-weight:bold;
	font-size:1.4em;
	letter-spacing:0.1em;
	padding-bottom:13px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
#headcopy_txt01 .shoku{
	font-size:1.95em;
	color:#874634;
}
#headcopy_txt02{
	font-weight:normal;
	font-size:1.0em;
	line-height:2.3em;
	letter-spacing:0.03em;
	white-space: nowrap;
}
#illust02{
	position:absolute;
	bottom:32%;
	right:-3.5%;
	width:13%;
}
.top_komidashi{
	width:100%;
	text-align:center;
	margin:110px 0 60px 0;
}
.top_komidashi_j{
	font-weight:bold;
	font-size:2.4em;
	letter-spacing:0.08em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.top_komidashi_e{
	font-weight:normal;
	font-size:1.2em;
	color:#109739;
	letter-spacing:0.08em;
}
.top_about_box{
	clear:both;
	position:relative;
	width:100%;
	margin-bottom:40px;
}
.top_about_txt_l{
	position:relative;
	float:left;
	width:60%;
}
.top_about_photo_r{
	float:right;
	width:36%;
}
.top_about_photo_r img{
	text-align:center;
	width:90%;
}
.top_about_txt_r{
	position:relative;
	float:right;
	width:59%;
}
.top_about_photo_l{
	width:36%;
}
.top_about_photo_l img{
	text-align:right;
	width:100%;
}
.shoku_icon{
	position:absolute;
	left:0;
	top:0;
	float:left;
	width:16%;
}
.about_komidashi_txt01{
	float:right;
	width:78%;
	padding:39px 0 0 0;
}

.about_komidashi_txt01_j{
	font-weight:bold;
	font-size:1.8em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height:1.2em;
}
.about_komidashi_txt01_e{
	font-weight:normal;
	font-size:1.0em;
	color:#109739;
	letter-spacing:0.08em;
	padding-left:2.8em;
}
.about_komidashi_txt01_no{
	font-size:1.72em;
}

.about_komidashi_txt02{
	clear:both;
	float:right;
	width:78%;
	font-size:0.9em;
	line-height:2.0em;
	margin:13px 0 0 0;
}
.about_komidashi_txt03{
	color:#d9987c;
	margin:14px 0 0 0;
	font-size:0.8em;
	line-height:1.8em;
}



.f70{
	font-size:70%;
}
#top_photo02{
	position:relative;
	left:25px;
}
.no4{
	padding-top:69px;
}
#top_photo04{
	position:relative;
	left:37px;
}
#top_photo05{
	width:100%;
	position:relative;
	right:15px;
}
.no6{
	padding-top:69px;
}
#top_photo06{
	position:relative;
	left:40px;
	width:96%;
}
#works_wrapp{
	position:relative;
	float:auto;
	width:100%;
	padding:70px 0;
	background-color:#f9ded2;
	margin-bottom:110px;
}
#top_work_list li{
	list-style:none;
	float:left;
	width:309px;
	margin-bottom:37px;
}
#top_work_list a{
	position:relative;
	z-index:4;
	text-decoration:none;
}
#top_work_list li img{
	width:309px;
	border-radius: 18px;
}
#top_work_list li:first-child{
	float:left;
	margin-right:37px;
}
#top_work_list li:last-child{
	float:right;
}
.works_midashi{
	text-align:left;
	font-weight:bold;
	margin:7px 0;
	font-size:1em;
}
.works_txt{
	text-align:left;
	font-size:0.84em;
	line-height:1.9em;
}
a.more_btn{
	display:block;
	position:relative;
	clear:both;
	width:309px;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:19px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
}
a.more_btn:hover{
	opacity: 0.6;
}
#illust03{
	position:absolute;
	top:-50%;
	left:-15%;
	width:19%;
}
.work_txt01{
	margin-bottom:45px;
	font-size:1.0em;
	line-height:2.2em;
}
#step_wrapp{
	position:relative;
	width:100%;
}
#step01_box{
	position:relative;
	float:left;
	width:280px;
}
#step01_box img{
	width:100%;
}
#step02_box{
	position:relative;
	float:left;
	width:280px;
}
#step02_box img{
	width:100%;
}
#step03_box{
	position:relative;
	float:left;
	width:280px;
}
#step03_box img{
	width:100%;
}
.arrow{
	display:block;
	float:left;
	width:78px;
	text-align:center;
	padding:230px 20px 0;
}
.arrow img{
	width:100%;
}
.step_txt01{
	position:absolute;
	top:290px;
	font-size:0.9em;
	line-height:2.0em;
	width:88%;
	margin:0 6%;
	
}
a.contact_btn{
	display:block;
	clear:both;
	width:100%;
	margin:20px auto 0;
	background-color:#874634;
	border-radius: 10px;
	padding:19px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
}
a.contact_btn:hover{
	opacity: 0.6;
}
#illust04{
	position:absolute;
	top:-450px;
	right:-170px;
	width:11%;
}




/*フッター*/

footer{
	float:left;
	width:100%;
	background-color:#874634;
	text-align:center;
	padding:48px 0 60px;
	margin-top:150px;
	overflow:hidden;
}
#bottom_logo{
	width:190px;
	margin:0 auto;
}
#footer_navi{
	width:100%;
	text-align:center;
	letter-spacing:0.07em;
	margin:20px 25px 22px;
}
.triangle{
	margin:0 4px 2px 0;
}
#footer_navi a{
	text-decoration:none;
	color:#fff;
	font-size:0.82em;
}
#footer_sns{
	width:100%;
	text-align:center;
}
#footer_insata{
	width:30px;
}
#footer_fb{
	width:30px;
	margin:0 20px;
}
#footer_youtube{
	width:30px;
	margin:3px 0;
}
#footer_txt{
	color:#fff;
	font-size:0.82em;
	margin:22px 0 23px;
	letter-spacing:0.07em;
}
#copyright{
	color:#fff;
	font-size:0.82em;
	letter-spacing:0.07em;
}

/*_________  About __________*/

.lower_midashi{
	width:100%;
	text-align:center;
	margin:160px 0 60px 0;
}
.lower_midashi_j{
	font-weight:bold;
	font-size:2.4em;
	letter-spacing:0.08em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.lower_midashi_e{
	font-weight:normal;
	font-size:1.2em;
	color:#109739;
	letter-spacing:0.08em;
}
#company_table{
	width:100%;
	border-collapse:collapse;
}
#company_table th{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	line-height:2em;
	padding:26px 0 24px 10px;
	vertical-align:top;
	width:15%;
}
#company_table tr{
	border-bottom:1px solid #edd4c9;
}
#company_table tr:last-child{
	border-bottom:none;
}
#company_table td{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	padding:26px 0 24px;
	vertical-align:top;
	line-height:2em;
}
#company_table td span{
	font-size:0.3em;
	line-height:1em;	
}
ul.company li{
	list-style-position:inside;
	list-style-type: disc;
}
/*_________  Privacy Policy __________*/

h3.pp_komidashi{
	font-size:1.2.5em;
	line-height:2em;	
	margin:0 0 16px;
}
.pp_txt{
	font-size:0.85em;
	line-height:2em;	
}
.pp_txt p{
	margin:0 0 30px;
}
ul.kaiji{
	position:relative;
	top:-12px;
}
ul.kaiji li{
	margin-left:20px;
	list-style-type: disc;
	list-style-position: outside;
}

/*_________  Contact __________*/

#contact_txt{
	font-weight:normal;
	font-size:0.85em;
	line-height:2em;
	padding-bottom:68px;
}
#contact_txt2{
	font-weight:normal;
	font-size:1.0em;
	line-height:2em;
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
#hissu{
	font-size:0.85em;
	line-height:3em;
}
.hissu_red{
	color:#cc0000;
}
#contact_table{
	width:100%;
	border-collapse:collapse;
}
#contact_table th{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	line-height:2.6em;
	padding:26px 0 24px;
	vertical-align:top;
	width:21%;
}
#contact_table tr{
	border-bottom:1px solid #edd4c9;
}
#contact_table tr:first-child{
	border-top:1px solid #edd4c9;
}
#contact_table td{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	padding:26px 0 24px;
	vertical-align:top;
	line-height:2em;
}
#contact_table2{
	width:100%;
	border-collapse:collapse;
}
#contact_table2 th{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	line-height:2.6em;
	padding:26px 0 24px;
	vertical-align:top;
	width:21%;
}
#contact_table2 tr{
	border-bottom:1px solid #edd4c9;
}
#contact_table tr:first-child{
	border-top:1px solid #edd4c9;
}
#contact_table2 td{
	text-align:left;
	font-weight:normal;
	font-size:0.85em;
	padding:26px 0 24px;
	vertical-align:top;
	line-height:2em;
}

label.custom-select { 
position: relative; 
display: inline-block; 
	width:40%;

    } 
.custom-select select { 
display: inline-block; 
	padding:10px 5px 10px 30px;
	margin: 0; 
	font: inherit; 
	outline:none; /* remove focus ring from Webkit */
	font-size:1.0em;
	line-height: 1.2; 
	background-color:#fff;
	width:100%;
} 
.custom-select:after { 
content: "▼"; /* Current arrow I would like to change */
position: absolute; 
top: 0; 
left: 0; 
bottom: 0; 
font-size: 60%; 
line-height: 4em; 
padding: 0 7px 0 13px; 
color: #fdb148; 
} 
.no-pointer-events .custom-select:after { 
content: none; 
} 
#contact_table input[type="text"] ,input[type="email"] {
	width:70%;
	font-size:1.0em;
	line-height: 1.2; 
	background-color:#fff;
	padding:10px 5px;
	width:40%;
}
#contact_table textarea{
	width:70%;
	font-size:1.0em;
	line-height: 1.2; 
	background-color:#fff;
	padding:10px 5px;
	width:70%;
}
#pp_link{
	width:100%;
	text-align:center;
	font-size:0.9em;
	padding:30px 0;
}

#send_btn input{
 	position:relative;
	display:block;
	clear:both;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
	width:30%;
}
#send_btn input:hover{
	opacity: 0.6;
}

/*_________  Works __________*/
#works_komidashi{
	width:100%;
	text-align:center;
	font-size:1.5em;
	margin-bottom:40px;
}
#works_slider{
	background-color:#f9f2ef;
	margin-bottom:40px;
}
#works_slider img{
	max-width:100%;
}
.sp-thumbnails{

}
#works_content{
	margin:70px 0 90px;
	width:100%;
	overflow:hidden;
}

a.works_top_btn{
	display:block;
	position:relative;
	clear:both;
	width:309px;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:19px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
}
a.works_top_btn:hover{
	opacity: 0.6;
}

#works_list li{
	list-style:none;
	float:left;
	width:310px;
	margin-bottom:34px;
}
#works_list a{
	position:relative;
	z-index:1;
	text-decoration:none;
}
#works_list li img{
	width:100%;
	border-radius: 18px;
}
#works_list li:first-child{
	float:left;
	clear:both;
	margin-right:36px;
}
#works_list li:nth-child(4){
	float:left;
	margin-right:36px;
}
#works_list li:nth-child(7){
	float:left;
	margin-right:36px;
}
#works_list li:nth-child(10){
	float:left;
	margin-right:36px;
}
#works_list li:nth-child(3n){
	float:right;
}
#works_cate_navi{
	float:left;
	positon:relative;
	margin:0 auto 84px;
	width:100%;
	text-align:center;
}
#works_cate_navi a{
	text-decoration:none;
	padding:0 10px;
}
#works_cate_navi a:hover{
	opacity:0.7;
}
#works_cate_navi a span{
	color:#fdb148;
}
.cate_active{
	color:#fdb148;
}

/*---------- pager_01 ----------*/

#pager_01 {
	clear: both;
	text-align: center;
	font-size:0.9em;
	padding-top: 78px;
	width:100%;
}
#pager_01 a.page-numbers {
	padding: 7px 11px;
	background-color: #874634;
	color: #fff;
	margin: 0 2px;
	transition: all 0.3s ease;
}
#pager_01 a.page-numbers:hover {
	background-color: #c88b7a;
}
#pager_01 span.current {
	padding: 7px 11px;
	background-color: #c88b7a;
	color: #fff;
	margin: 0 2px;
}
#pager_01 a{
	text-decoration:none;
}
#pager_01 a.prev, #pager_01 a.next {
	color: #874634;
	padding: 0 10px;
	background: none;
}
#pager_01 a.prev:hover, #pager_01 a.next:hover {
	background: none;
	color: #c88b7a;
}

/***** Contant s****/
#send_btn2{
	clear:both;
	float:left;
	text-align:right;
	width:57%;
	margin-top:50px;

}
#send_btn2 input{
	display:block;
	margin:0 0 0 30%;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
	width:70%;
}
#send_btn2 input:hover{
	opacity: 0.6;
}
#back_btn{
	float:right;
	text-align:left;
	width:41%;
	margin-top:50px;
}
#back_btn input{
	display:block;
	margin:0 50% 0 0;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
	width:55%;
}
#back_btn input:hover{
	opacity: 0.6;
}

#back_btn2 a{
 	position:relative;
	display:block;
	clear:both;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
	width:30%;
}
#back_btn2 a:hover{
	opacity: 0.6;
}

/*______________________________________PC用CSS_______________________________________________*/
@media screen and (min-width: 767px) {/*ウィンドウ幅が767px以上の場合に適用*/
.pc_content{
	display:block;
}
.sp_content{
	display:none;
}
a img:hover{
	opacity: 0.6;
	filter: alpha(opacity=60);
	-moz-opacity:0.6;
}

}




/*______________________________________スマホ用CSS_______________________________________________*/
@media print, screen and (max-width: 767px) {/*ウィンドウ幅が最大767pxまでの場合に適用*/
	.pc_content{
display:none;
	}
	.sp_content{
display:block;
	}

body html{
	font-size:20px;
}
body .index_body{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 500;
	/*font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;*/
	color:#000;
	background-color:#f9f2ef;
	background-image:url(../img/bg_line_sp.svg);
	background-position:top 130px center;
	background-size:100% auto;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
body .lowe_body{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 500;
	/*font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif;*/
	color:#000;
	background-color:#f9f2ef;
	background-image:url(../img/bg_line2_sp.svg);
	background-position:top 130px center;
	background-size:100% auto;
	animation: fadeIn 3s ease 0s 1 normal;
	-webkit-animation: fadeIn 3s ease 0s 1 normal;
	font-size:30px;
}

/*ハンバーガーメニュー*/
nav.NavMenu{
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	background: rgba(255,165,40,0.9);
	color: #fff;
	font-size:1.5em;
	line-height:0.76em;
	text-align: center;/*テキストを中央揃え*/
	width: 100%;	/*全幅表示*/
	height: 100vh;	/*全幅表示*/
	transform: translateX(100%);	/*ナビを上に隠す*/
	transition: all 0.3s;	/*アニメーションの時間を指定*/
}
nav.NavMenu ul{
	/*background: #fff;*/
	width: 100%;	
	margin: 0 auto;
	padding: 0;
}
nav.NavMenu ul li{
	font-size: 1.3em;
	list-style-type: none;
	padding: 0;
	width: 100%;
	/*border-bottom: 1px dotted #888;*/
}
nav.NavMenu ul li:first-child{
	padding-top: 30%;
	padding-bottom: 28px;
}
nav.NavMenu ul li:last-child{
	padding-bottom: 0;
	border-bottom: none;	/*最後のメニュー項目のみ下線を消す*/
}
#navi_sns{
	text-align:center;
	margin-top:50px;
}
#navi_insata{
	width:30px;
}
#navi_fb{
	width:30px;
	margin:0 20px;
}
#navi_youtube{
	width:30px;
	margin:3px 0;
}

nav.NavMenu ul li a{
	display: block;/*クリックできる領域を広げる*/
	color: #fff;
	padding: 1em 0;
	text-decoration:none;
}
nav.NavMenu ul li a:hover{
	color: #666;
}
nav.NavMenu.active{
	transform: translateY(0%);/*ナビを表示する*/
}

.Toggle {
	display: block;
	position: fixed;	/* bodyに対しての絶対位置指定 */
	right: 30px;
	top: 30px;
	width: 70px;
	height: 70px;
	cursor: pointer;
	z-index: 3;
	background-image:url(../img/humberger_bg.svg);
	background-size:cover;
	background-position:center center;
}
.Toggle span {
	display: block;
	position: absolute;
	width: 30px;
	border-bottom: solid 3px #fff;
	-webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
	-moz-transition: .35s ease-in-out;/*変化の速度を指定*/
	transition: .35s ease-in-out;	/*変化の速度を指定*/
	left: 20px;
}
.Toggle span:nth-child(1) {
	top: 24px;
}
.Toggle span:nth-child(2) {
	top: 33px;
}
.Toggle span:nth-child(3) {
	top: 43px;
}
 
/* 最初のspanをマイナス45度に */
.Toggle.active span:nth-child(1) {
	top: 33px;
	left: 20px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
 
/* 2番目と3番目のspanを45度に */
.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
	top: 33px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}


header{
	position:relative;
	float:left;
	width:100%;
	min-width:750px;
	margin-bottom:15px;
}
#logo{
	clear:both;
	float:left;
	padding:25px 30px;
	width:250px;
	z-index:99;
}
#logo img{
	width:100%;
}
#totop{
	position:fixed;
	right:30px;
	bottom:30px;
	width:100px;
}
.wrapp1200{
	width:92%;
	margin:0 4%;
	min-width:690px;
}
.wrapp1000{
	clear:both;
	position:relative;
	width:92%;
	margin:0 4%;
	min-width:690px;
}
#slider_wrapp{
	position:relative;
	width:97%;
	margin:0 1.5%;
	padding:0;
}
#slider_wrapp li img{
	width:100%;
}
#illust01{
	position:absolute;
	left:60%;
	top:9%;
	width:38%;
}
#headcopy_wrapp{
	position:relative;
	background-image:url(../img/headcopy_bg.svg);
	background-size:contain;
	background-position:center center;
	width:97%;
	margin:30px auto 50px;
	top:0;
	height:auto;
	overflow:hidden;
}
#headcopy{
	position:relative;
	float:left;
	left:130px;
	width:29.0%;
}
#headcopy_txt{
	clear:both;
	position:relative;
	width:100%;
	left:0;
	top:0;
	margin:0;
	overflow:auto;
}

#headcopy_txt01{
	font-weight:bold;
	font-size:2.0em;
	letter-spacing:0;
	padding:50px 0;
	line-height:1.4em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
#headcopy_txt01 .shoku{
	font-size:1.67em;
	color:#874634;
}
#headcopy_txt02{
	font-weight:normal;
	font-size:1.80em;
	line-height:2.2em;
	letter-spacing:-0.02em;
	width:100%;
	white-space: normal;
}
#illust02{
	position:absolute;
	top:46%;
	right:2%;
	width:140px;
}
.top_komidashi{
	width:100%;
	text-align:center;
	margin:13px 0 20px 0;

}
.top_komidashi_j{
	font-weight:bold;
	font-size:3.0em;
	letter-spacing:0.08em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.top_komidashi_e{
	font-weight:normal;
	font-size:1.8em;
	color:#109739;
	letter-spacing:0.08em;
}
.top_about_box{
	clear:both;
	position:relative;
	width:100%;
	margin-bottom:0;
}
.top_about_txt_l{
	position:relative;
	float:left;
	width:100%;
}
.top_about_photo_r{
	float:left;
	width:70%;
	margin:30px 15% 10px;
	text-align:center;
}
.top_about_photo_r img{
	width:90%;
}
.top_about_txt_r{
	position:relative;
	float:right;
	width:100%;
}
.top_about_photo_l{
	float:left;
	width:70%;
	margin:30px 15%;
	text-align:center;
}
.top_about_photo_l img{
	width:90%;
}
.shoku_icon{
	position:absolute;
	left:0;
	top:0;
	float:left;
	width:15%;
}
.about_komidashi_txt01{
	float:right;
	width:83%;
	padding:35px 0 0 0;
}

.about_komidashi_txt01_j{
	font-weight:bold;
	font-size:2.1em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height:1.0em;
}
.about_komidashi_txt01_e{
	font-weight:normal;
	font-size:1.3em;
	color:#109739;
	letter-spacing:0.08em;
	padding-left:2.6em;
}
.about_komidashi_txt01_no{
	font-size:1.7em;
}

.about_komidashi_txt02{
	clear:both;
	float:right;
	width:100%;
	font-size:1.8em;
	line-height:2.3em;
	margin:13px 0 0 0;
}
.about_komidashi_txt03{
	color:#d9987c;
	margin:14px 0 0 0;
	font-size:0.9em;
	line-height:1.6em;
}
.f70{
	font-size:70%;
}
#top_photo02{
	position:relative;
}
.no4{
	padding-top:0;
}
#top_photo03{
	position:relative;
	top:-30px;
	margin:0;
	width:83%;
}
#top_photo04{
	position:relative;
	left:37px;
}
#top_photo05{
	width:96%;
	position:relative;
	right:15px;
}
.no6{
	padding-top:20px;
}
#top_photo06{
	position:relative;
	top:-30px;
	left:0;
	width:90%;
}
#works_wrapp{
	position:relative;
	float:auto;
	width:100%;
	padding:70px 0 150px;
	background-color:#f9ded2;
	margin-bottom:60px;
}
#top_work_list li{
	list-style:none;
	float:left;
	width:70%;
	margin: 0 15% 32px;
}
#top_work_list a{
	text-decoration:none;
}
#top_work_list li img{
	width:100%;
	border-radius: 18px;
}
#top_work_list li:first-child{
	float:left;
	margin-right:0;
}
#top_work_list li:last-child{
	float:left;
}
.works_midashi{
	text-align:left;
	font-weight:bold;
	margin:7px 0;
	font-size:1.8em;
}
.works_txt{
	text-align:left;
	font-size:1.6em;
	line-height:1.9em;
}
a.more_btn{
 	position:relative;
	display:block;
	clear:both;
	width:100%;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:29px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	font-size:1.8em;
	line-height:1.8em;
	text-decoration:none;
}
a.more_btn:hover{
	opacity: 0.6;
}
#illust03{
	position:absolute;
	top:-280px;
	left:0;
	width:160px;
}
.work_txt01{
	margin-bottom:0;
	margin-top:30px;
	font-size:1.6em;
	line-height:2.0em;
}
#step_wrapp{
	position:relative;
	width:100%;
	min-width:690px;
	margin-top:30px;
}
#step01_box{
	position:relative;
	float:left;
	width:70%;
	margin:60px 15% 0;
}
#step01_box img{
	width:100%;
}
#step02_box{
	position:relative;
	float:left;
	width:70%;
	margin:0 15%;
}
#step02_box img{
	width:100%;
}
#step03_box{
	position:relative;
	float:left;
	width:70%;
	margin:0 15%;
}
#step03_box img{
	width:100%;
}
.arrow{
	display:block;
	float:left;
	width:100%;
	text-align:center;
	padding:30px 0 0;
}
.arrow img{
	width:38px;
}
.step_txt01{
	position:absolute;
	top:400px;
	font-size:1.4em;
	line-height:1.8em;
	width:88%;
	margin:0 6%;
	
}
a.contact_btn{
	display:block;
	clear:both;
	width:100%;
	margin:20px auto 0;
	background-color:#874634;
	border-radius: 10px;
	padding:19px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.0em;
	text-decoration:none;
}
a.contact_btn:hover{
	opacity: 0.6;
}
#illust04{
	position:absolute;
	top:-540px;
	right:0;
	width:90px;
}




/*フッター*/

footer{
	float:left;
	width:100%;
	min-width:750px;
	background-color:#874634;
	text-align:center;
	padding:48px 0 60px;
	margin-top:80px;
	overflow:hidden;
}
#bottom_logo{
	width:190px;
	margin:0 auto;
}
#footer_navi{
	width:100%;
	text-align:center;
	letter-spacing:0.07em;
	margin:20px 0;
}
.triangle{
	margin:0 4px 2px 0;
}
#footer_navi a{
	text-decoration:none;
	color:#fff;
	font-size:1.4em;
}
#footer_sns{
	width:100%;
	text-align:center;
}
#footer_insata{
	width:30px;
}
#footer_fb{
	width:30px;
	margin:0 20px;
}
#footer_youtube{
	width:30px;
	margin:3px 0;
}
#footer_txt{
	color:#fff;
	font-size:1.3em;
	margin:22px 0 23px;
	letter-spacing:0.07em;
}
#copyright{
	color:#fff;
	font-size:1.3em;
	letter-spacing:0.07em;
}

/*_________  About __________*/

.lower_midashi{
	float:left;
	width:100%;
	text-align:center;
	margin:13px 0 50px 0;
}
.lower_midashi_j{
	font-weight:bold;
	font-size:2.0em;
	letter-spacing:0.08em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.lower_midashi_e{
	font-weight:normal;
	font-size:1.0em;
	color:#109739;
	letter-spacing:0.08em;
}
#company_table{
	width:100%;
	border-collapse:collapse;
}
#company_table th{
	display:block;
	text-align:center;
	font-weight:bold;
	font-size:1.8em;
	line-height:2em;
	padding:26px 0 10px 10px;
	vertical-align:top;
	width:100%;
}
#company_table tr{
	border-bottom:1px solid #edd4c9;
}
#company_table tr:last-child{
	border-bottom:none;
}
#company_table td{
	display:block;
	text-align:left;
	font-weight:normal;
	font-size:1.5em;
	padding:26px 0 24px;
	vertical-align:top;
	line-height:2em;
	width:100%;
}
#company_table td span{
	font-size:1.2em;
	line-height:1em;	
}
ul.company li{
	margin-left:20px;
	list-style-type: disc;
	list-style-position: outside;
}

/*_________  Privacy Policy __________*/

h3.pp_komidashi{
	font-size:1.8em;
	line-height:2em;	
	margin:0 0 16px;
}
.pp_txt{
	font-size:1.65em;
	line-height:2em;	
}
.pp_txt p{
	margin:0 0 30px;
}
ul.kaiji{
	position:relative;
	top:-12px;
}
ul.kaiji li{
	margin-left:20px;
	list-style-type: disc;
	list-style-position: outside;
}


/*_________  Contact __________*/
#send_btn2{
	clear:both;
	float:left;
	text-align:right;
	width:57%;
	margin-top:50px;

}
#send_btn2 input{
	display:block;
	margin:0;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	font-size:1.6em;
	line-height:1.0em;
	text-decoration:none;
	width:100%;
}
#send_btn2 input:hover{
	opacity: 0.6;
}
#back_btn{
	float:right;
	text-align:left;
	width:41%;
	margin-top:50px;
}
#back_btn input{
	display:block;
	margin:0;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	font-size:1.6em;
	line-height:1.0em;
	text-decoration:none;
	width:100%;
}
#back_btn input:hover{
	opacity: 0.6;
}

#back_btn2 a{
 	position:relative;
	display:block;
	clear:both;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:20px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	line-height:1.6em;
	text-decoration:none;
	width:50%;
}
#back_btn2 a:hover{
	opacity: 0.6;
}

#contact_txt{
	font-weight:normal;
	font-size:1.8em;
	line-height:2em;
	padding-bottom:68px;
}
#contact_txt2{
	font-weight:normal;
	font-size:1.8em;
	line-height:2em;
	padding-bottom:30px;
	width:100%;
	text-align:center;
}
#hissu{
	font-size:1.80em;
	line-height:3em;
}
.hissu_red{
	color:#cc0000;
}
#contact_table{
	width:100%;
	border-collapse:collapse;
}
#contact_table th{
	text-align:left;
	font-weight:normal;
	font-size:1.80em;
	line-height:2.6em;
	padding:5px 0 0;
	vertical-align:top;
	width:21%;
	display: block;
	width:100%;
}
#contact_table tr{
	border-bottom:1px solid #edd4c9;
}
#contact_table tr:first-child{
	border-top:1px solid #edd4c9;
}
#contact_table td{
	text-align:left;
	font-weight:normal;
	font-size:1.80em;
	padding:3px 0 20px;
	vertical-align:top;
	line-height:2em;
	display: block;
	width:100%;
}



#contact_table2{
	width:100%;
	border-collapse:collapse;
}
#contact_table2 th{
	text-align:left;
	font-weight:bold;
	font-size:1.80em;
	line-height:2.6em;
	padding:5px 0 0;
	vertical-align:top;
	width:21%;
	display: block;
	width:100%;
}
#contact_table2 tr{
	border-bottom:1px solid #edd4c9;
}
#contact_table2 tr:first-child{
	border-top:1px solid #edd4c9;
}
#contact_table2 td{
	text-align:left;
	font-weight:normal;
	font-size:1.80em;
	padding:3px 0 20px;
	vertical-align:top;
	line-height:2em;
	display: block;
	width:100%;
}


label.custom-select { 
position: relative; 
display: inline-block; 
	width:100%;

    } 
.custom-select select { 
display: inline-block; 
	padding:10px 5px 10px 50px;
	margin: 0; 
	font: inherit; 
	outline:none; /* remove focus ring from Webkit */
	font-size:1.0em;
	line-height: 1.4em; 
	background-color:#fff;
	width:100%;
} 
.custom-select:after { 
content: "▼"; /* Current arrow I would like to change */
position: absolute; 
top: 0; 
left: 0; 
bottom: 0; 
line-height: 3em; 
padding: 0 7px 0 13px; 
color: #fdb148; 
} 
.no-pointer-events .custom-select:after { 
content: none; 
} 
#contact_table input[type="text"] ,input[type="email"] {
	width:70%;
	font-size:1.4em;
	line-height: 1.2; 
	background-color:#fff;
	padding:5px 5px;
	width:100%;
}
#contact_table textarea{
	width:70%;
	font-size:1.4em;
	line-height: 1.5; 
	background-color:#fff;
	padding:5px 5px;
	width:100%;
	height:300px;
}
#pp_link{
	width:100%;
	text-align:center;
	font-size:1.6em;
	padding:30px 0;
}

#send_btn input{
 	position:relative;
	display:block;
	clear:both;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:22px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	font-size:1.6em;
	text-decoration:none;
	width:60%;
}
#send_btn input:hover{
	opacity: 0.6;
}
/*_________  Works __________*/
#works_komidashi{
	width:100%;
	text-align:center;
	font-size:1.5em;
	margin-bottom:40px;
}
#works_slider{
	background-color:#f9f2ef;
	margin-bottom:40px;
}
#works_slider img{
	max-width:100%;
}
.sp-thumbnails{

}
#works_content{
	margin:70px 0 85px;
	width:100%;
	overflow:hidden;
	font-size:1.8em;
}

a.works_top_btn{
	display:block;
	position:relative;
	clear:both;
	width:80%;
	margin:0 auto;
	background-color:#874634;
	border-radius: 10px;
	padding:25px 0;
	text-align:center;
	color:#fff;
	letter-spacing:0.1em;
	font-size:1.4em;
	line-height:1.0em;
	text-decoration:none;
}
a.works_top_btn:hover{
	opacity: 0.6;
}

#works_list li{
	list-style:none;
	float:none;
	width:100%;
	margin:0 auto;
	padding:0 0 34px;
}
#works_list a{
	position:relative;
	z-index:1;
	text-decoration:none;
}
#works_list li img{
	width:100%;
	border-radius: 18px;
	margin:0 auto;
}
#works_list li:first-child{
	float:none;
	margin:0 auto;
}
#works_list li:nth-child(2n){
	float:none;
	margin:0 auto;
}
#works_list li:nth-child(3n){
	float:none;
	margin:0 auto;
}
#works_list li:nth-child(4n){
	float:none;
	margin:0 auto;
}


#works_cate_navi{
	float:left;
	positon:relative;
	margin:0 auto 43px;
	width:100%;
	text-align:center;
}
#works_cate_navi a{
	text-decoration:none;
	padding:0 20px;
	font-size:1.7em;
	line-height:2.2em;
}
#works_cate_navi a:hover{
	opacity:0.7;
}
#works_cate_navi a span{
	color:#fdb148;
}
.cate_active{
	color:#fdb148;
}

/*---------- pager_01 ----------*/

#pager_01 {
	clear: both;
	text-align: center;
	font-size:0.9em;
	padding-top: 35px;
	width:100%;
}
#pager_01 a.page-numbers {
	padding: 7px 11px;
	background-color: #874634;
	color: #fff;
	margin: 0 2px;
	transition: all 0.3s ease;
}
#pager_01 a.page-numbers:hover {
	background-color: #c88b7a;
}
#pager_01 span.current {
	padding: 7px 11px;
	background-color: #c88b7a;
	color: #fff;
	margin: 0 2px;
}
#pager_01 a{
	text-decoration:none;
}
#pager_01 a.prev, #pager_01 a.next {
	color: #874634;
	padding: 0 10px;
	background: none;
}
#pager_01 a.prev:hover, #pager_01 a.next:hover {
	background: none;
	color: #c88b7a;
}



}