@charset "UTF-8";
/*============================================ Base ============================================*/
/*Reset-----------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,ins,kbd,
q,samp,small,strong,sub,sup,var,b,i,a,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,
thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,
mark,audio,video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-weight: normal; }
img { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: bottom; background: transparent; }
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block; }
ol,ul { list-style: none; }
blockquote,q { quotes: none; }
blockquote:before,blockquote:after,
q:before,q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
ol,ul { list-style: none; }

/*Base-----------------*/
*,:before,:after { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; }
html { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: 100%; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; }

body { height: 100%; text-rendering: optimizeLegibility; /*font-family: 游ゴシック, sans-serif !important;*/ 
	/*font-family: 'M PLUS Rounded 1c', sans-serif;*/
	font-family: dnp-shuei-mgothic-std,sans-serif;
	font-weight: 400;
	font-style: normal;
	 line-height: 1.6; }
img { max-width: 100%; height: auto; vertical-align: bottom; }
a { text-decoration: none; color: #373737; transition: all 0.3s;}

/*============================================ Common ============================================*/
/*header-------*/
#header .container{
	position: relative;
}
.header_gl_menu{
	text-align: center;
}
.nav_menu li a{
	font-size: 18px;
	font-weight: bold;
}
.link_contact .btn_link::before{
	content: " ";
	background: url(../img/mail001.svg) no-repeat;
	background-size: 100%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 12px;
	width: 16px;
	height: 16px;
}
@media screen and (min-width: 737px){
	.header_logo{
		border-bottom: 1px solid #E5E5E5;
		text-align: center;
		padding: 5px 0 15px;
	}
	.header_logo img{
		width: 160px;
	}
	.nav_menu{
		display: flex;
		justify-content: space-between;
		width: 94%;
		max-width: 900px;
		margin: 15px auto;
	}
	.nav_menu li a:hover{
		color: #2FA525;
	}
	.link_contact .btn_link{
		padding: 10px 46px;
	}
	.link_contact{
		width: 94%;
		max-width: 900px;
		text-align: right;
		margin: -70px auto 35px;
	}
	.logo_nav,
	.link_store,
	.drawer-hamburger{
		display: none;
	}
	.drawer-nav {
	  position: static;
	  overflow: visible;
	  width: 100%;
	  height: auto;
	  background: none;
	}
}
@media screen and (max-width: 736px){
	.header_logo{
		width: 50%;
	}
	.header_logo img{
		width: 90px;
		margin: 5px 10px 10px;
	}
	.link_store .btn_link{
		background: #433214;
	}
	.drawer-menu{
		display: flex;
		flex-direction: column;
		padding: 0 10%;
		height: 98%;
		overflow: auto;
		margin: 20px auto;
	}
	.logo_nav{
		width: 50%;
		margin: 0 auto 60px;
		order: 1;
	}
	.nav_menu{
		order: 2;
		width: 100%;
		text-align: left;
	}
	.nav_menu li{
		margin-bottom: 45px;
	}
	.link_contact{
		order: 3;
		width: 100%;
		margin-bottom: 15px;
	}
	.link_store{
		order: 4;
		width: 100%;
	}
	.link_contact a,
	.link_store a{
		width: 100%;
	}
}

/*footer-------*/
.copyright {
	background: #382720;
	font-size: 12px;
	text-align: center;
	padding: 30px 0 25px;
	color: #FFF;
}
@media screen and (min-width: 737px){
	.copyright {
		padding: 30px 0 25px;
	}
}
@media screen and (max-width: 736px){
	.copyright {
		padding: 20px 0 15px;
	}
}

/*============================================ Main ============================================*/
/*STYLE-------*/
.txt_green{
	color: #2FA525;
}
.txt_white{
	color: #FFF;
}
.txt_brown{
	color: #433214;
}
.txt_red{
	color: #FF0000;
}
.font_min{
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
.align_center{
	text-align: center;
}
.content_inner {
	margin: 0 auto;
}
.container h2{
	font-weight: bold;
	text-align: center;
}
.obj_leaf{
	position: relative;
	background: url(../img/bg_list.png) repeat;
}
.obj_leaf::before{
	content: " ";
	width: 100%;
	height: 66px;
	background: url(../img/leaf.png) repeat-x;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	margin: -33px 0 0;
}
.tit_border_style span{
	display: inline-block;
	vertical-align: middle;
	color: #433214;
	font-weight: bold;
}
.tit_border_style::before,
.tit_border_style::after{
	content: " ";
	border-top: 1px solid #707070;
	border-bottom: 1px solid #707070;
	display: inline-block;
	vertical-align: middle;
}
.tit_border_style::before{
	margin-right: 2%;
}
.tit_border_style::after{
	margin-left: 2%;
}
.btn_link{
	background: #2FA525;
	display: inline-block;
	padding: 15px 35px;
	color: #FFF;
	font-weight: bold;
	border-radius: 3px;
}
@media screen and (min-width: 737px){
	.content_inner {
		width: 90%;
		max-width: 1182px;
	}
	.container h2{
		font-size: 40px;
	}
	.obj_leaf{
		padding: 90px 0;
	}
	.tit_border_style::before,
	.tit_border_style::after{
		width: 10%;
		height: 6px;
	}
	.pc_none{
		display: none;
	}
	.btn_link:hover{
		background: #4ad93e;
	}
}
@media screen and (max-width: 736px){
	.content_inner {
		width: 82%;
		margin-top: 20px;
	}
	.container h2{
		font-size: 26px;
	}
	.obj_leaf{
		padding: 40px 0 60px;
	}
	.tit_border_style::before,
	.tit_border_style::after{
		width: 20%;
		height: 6px;
	}
}

/*MAIN-------*/
.main_visual{
	width: 100%;
	text-align: center;
	color: #FFF;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.main_visual h2{
	line-height: 1;
	font-weight: bold;
	margin-bottom: 10px;
}
.main_visual p{
	font-weight: bold;
}
@media screen and (min-width: 737px){
	.main_visual{
		background: url(../img/img_mv.png) no-repeat;
		background-size: cover;
		min-height: 840px;
	}
	.main_visual h2{
		font-size: 94px;
	}
	.main_visual p{
		font-size: 23px;
	}
}
@media screen and (max-width: 736px){
	.main_visual{
		background: url(../img/img_mv@2x.png) no-repeat;
		background-size: cover;
		min-height: 492px;
	}
	.main_visual h2{
		font-size: 52px;
		margin-bottom: 30px;
	}
	.main_visual p{
		font-size: 15px;
	}
}

/*ITEM-------*/
#item .list_item li img{
	border-radius: 8px;
}
#item .tit_item_detail{
	color: #433214;
	font-weight: bold;
	text-align: center;
	font-size: 25px;
	margin: 26px 0 20px;
}
#item .tit_item_detail img{
	width: 40px;
}
#item .txt_item_detail{
	color: #222;
}
@media screen and (min-width: 737px){
	#item .list_item{
		display: flex;
		justify-content: space-between;
		margin: 80px auto 45px;
	}
	#item .list_item li{
		width: 30%;
	}
	#item .txt_item_detail{
		font-size: 18px;
	}
}
@media screen and (max-width: 736px){
	#item .list_item{
		margin-top: 35px;
	}
	#item .list_item li .photo{
		width: 70%;
		text-align: center;
		margin: 0 auto;
	}
	#item .txt_item_detail{
		font-size: 16px;
	}
	#item .list_item li{
		margin-bottom: 40px;
	}
}

/*FLOW-------*/
#flow .content_inner{
	background: #FFF;
}
#flow .list_flow li::before{
	content: " ";
	display: block;
	width: 100px;
	height: 100px;
}
#flow .list_flow li .tit_flow span{
	color: #2FA525;
	margin-right: 12px;
	font-weight: bold;
}
#flow .tit_flow{
	font-weight: bold;
}
@media screen and (min-width: 737px){
	#flow .container{
		background: url(../img/bg_flow_left.png) no-repeat -25% top,
		url(../img/bg_flow_left.png) no-repeat 175% top;
	}
	#flow .content_inner{
		padding: 120px 12%;
	}
	#flow .list_flow{
		margin: 80px auto 0;
	}
	#flow .list_flow li{
		margin-bottom: 70px;
		padding-left: 110px;
		position: relative;
	}
	#flow .list_flow li::before{
		position: absolute;
		top: 0.5em;
		left: 0;
	}
	#flow .list_flow li:nth-child(1)::before{
		background: url(../img/ico_mail.svg) no-repeat center top;
		background-size: 60%;
	}
	#flow .list_flow li:nth-child(2)::before{
		background: url(../img/ico_memo.svg) no-repeat 40% top;
		background-size: 54%;
	}
	#flow .list_flow li:nth-child(3)::before{
		background: url(../img/ico_write.svg) no-repeat center top;
		background-size: 58%;
	}
	#flow .list_flow li:nth-child(4)::before{
		background: url(../img/ico_start.png) no-repeat center top;
		background-size: 90%;
	}
	#flow .tit_flow{
		font-size: 28px;
		margin-bottom: 20px;
	}
	#flow .txt_flow{
		font-size: 20px;
	}
}
@media screen and (max-width: 736px){
	#flow .content_inner{
		padding: 75px 0;
	}
	#flow .list_flow li{
		margin-bottom: 40px;
	}
	#flow .tit_flow{
		font-size: 21px;
		margin-bottom: 20px;
		text-align: center;
	}
	#flow .txt_flow{
		font-size: 16px;
	}
	#flow .list_flow li::before{
		margin: 0 auto;
	}
	#flow .list_flow li:nth-child(1)::before{
		background: url(../img/ico_mail.svg) no-repeat center center;
		background-size: 60%;
	}
	#flow .list_flow li:nth-child(2)::before{
		background: url(../img/ico_memo.svg) no-repeat center center;
		background-size: 54%;
	}
	#flow .list_flow li:nth-child(3)::before{
		background: url(../img/ico_write.svg) no-repeat center center;
		background-size: 58%;
	}
	#flow .list_flow li:nth-child(4)::before{
		background: url(../img/ico_start.png) no-repeat center center;
		background-size: 90%;
	}
}

/*WORK-------*/
#work .container{
	background: url(../img/bg_work.png) no-repeat;
	background-size: cover;
}
@media screen and (min-width: 737px){
	#work .content_inner{
		padding: 180px 0 175px;
	}
	#work .list_work{
		margin: 110px auto 0;
		width: 100%;
		max-width: 1125px;
		display: flex;
		justify-content: space-around;
		flex-wrap:wrap;
	}
	#work .list_work li:nth-child(1),
	#work .list_work li:nth-child(4){
		width: 48.2%;
		max-width: 535px;
		margin-bottom: 2%;
	}
	#work .list_work li:nth-child(2),
	#work .list_work li:nth-child(3){
		width: 49.5%;
		max-width: 550px;
		margin-bottom: 2%;
	}
}
@media screen and (max-width: 736px){
	#work .content_inner{
		padding: 55px 0 80px;
	}
	#work .list_work{
		margin: 45px auto 0;
	}
	#work .list_work li{
		margin: 0 auto 4%;
		width: 100%;
		max-width: 535px;
		text-align: center;
	}
}

/*VOICE-------*/
#voice .list_voice li{
	background: #FFF;
	border-radius: 12px;
	margin-bottom: 25px;
	position: relative;
}
#voice .list_voice li:last-child{
	margin-bottom: 0;
}
#voice .list_voice li::before{
	content: " ";
	display: block;
	width: 42px;
	background: url(../img/user001.svg) no-repeat;
	background-size: 100%;
}
#voice .tit_voice{
	font-weight: bold;
	margin-bottom: 20px;
}
#voice .tit_voice span{
	color: #222;
	display: block;
	margin-top: 10px;
}
@media screen and (min-width: 737px){
	#voice .content_inner{
		padding: 90px 0 0;
	}
	#voice .list_voice{
		margin: 100px auto 0;
		width: 100%;
		max-width: 1000px;
	}
	#voice .list_voice li{
		padding: 40px 60px 40px 162px;
	}
	#voice .list_voice li::before{
		height: 75px;
		position: absolute;
		top: 40px;
		left: 60px;
	}
	#voice .tit_voice{
		font-size: 28px;
		line-height: 1.4;
	}
	#voice .tit_voice span{
		font-size: 16px;
		text-indent: -0.5em;
	}
	#voice .txt_voice{
		font-size: 16px;
	}
}
@media screen and (max-width: 736px){
	#voice .content_inner{
		width: 90%;
		padding-top: 20px;
	}
	#voice .list_voice{
		margin: 32px auto 0;
	}
	#voice .list_voice li{
		padding: 28px;
	}
	#voice .list_voice li::before{
		height: 55px;
		margin: 0 auto;
	}
	#voice .tit_voice{
		font-size: 17px;
		text-align: center;
	}
	#voice .tit_voice span{
		font-size: 14px;
		text-align: left;
		margin-top: 5px;
	}
	#voice .txt_voice{
		font-size: 15px;
	}
}

/*contact-------*/
#contact h2{
	margin-bottom: 40px;
}
#contact input,
#contact textarea{
	border: 1px solid #C8C8C8;
	padding: 10px;
	font-size: 18px;
}
.contact_form table{
	width: 100%;
}
.contact_form table th{
	font-size: 18px;
	font-weight: bold;
	text-align: left;
}
.btn_submit button,
.btn_return input{
	display: inline-block;
	font-weight: bold;
	border-radius: 3px;
	border: none;
	cursor: pointer;
	transition: all 0.3s;
}
.btn_submit button{
	background: #2FA525;
	padding: 15px 64px;
	color: #FFF;
	font-size: 18px;
}
.btn_return input{
	padding: 15px 64px;
}
.btn_return{
	margin-top: 20px;
}
@media screen and (min-width: 737px){
	#contact .content_inner{
		max-width: 780px;
		padding: 100px 0;
	}
	.contact_form table th{
		padding-bottom: 30px;
		width: 36%;
		vertical-align: top;
	}
	.contact_form table{
		margin: 56px 0;
	}
	.btn_submit button:hover{
		background: #4ad93e;
	}
	.btn_return input:hover{
		background: #ddd;
	}
	.input_l,
	.textarea{
		width: 100%;
	}
	.input_s{
		width: 70%;
	}
}
@media screen and (max-width: 736px){
	#contact .content_inner{
		width: 86%;
		padding: 64px 0 100px;
	}
	.contact_form table{
		margin: 24px 0 14px;
	}
	.contact_form table th,
	.contact_form table td{
		display: block;
	}
	.contact_form table td{
		margin: 16px 0 34px;
	}
	.input_l,
	.input_s,
	.textarea{
		width: 100%;
	}
}

/*STORE-------*/
#store .layout_store{
	overflow: hidden;
	background: #FFF;
	border-radius: 12px;
	box-sizing: border-box;
}
#store .tit_store{
	font-size: 29px;
	font-weight: bold;
}
#store .tit_store_name{
	font-weight: bold;
	line-height: 1.4;
}
#store .tit_store_name span{
	display: block;
}
#store .txt_store{
	margin-top: 30px;
}
#store .box_sns{
	margin-top: 25px;
}
#store .txt_sns{
	font-size: 18px;
	font-weight: bold;
}
#store .list_sns{
	display: flex;
	justify-content: space-between;
	flex-wrap:wrap;
}
#store .list_sns li{
	width: 49%;
	margin-bottom: 2%;
}
#store .list_sns a{
	border-radius: 3px;
	display: block;
	color: #FFF;
	text-align: center;
	font-weight: bold;
}
#store .list_sns .bt_tw a{
	background: url(../img/ico_tw.svg) no-repeat 10% center #433214;
}
#store .list_sns .bt_fb a{
	background: url(../img/ico_fb.svg) no-repeat 10% center #433214;
}
#store .list_sns .bt_insta a{
	background: url(../img/ico_insta.svg) no-repeat 10% center #433214;
}
#store .list_sns .bt_ameblo a{
	background: url(../img/ico_pen.svg) no-repeat 10% center #433214;
}
@media screen and (min-width: 737px){
	#store .layout_store{
		padding: 60px;
		margin: 120px 0 10%;
	}
	#store .tit_store{
		margin-bottom: 30px;
	}
	#store .tit_store_name{
		font-size: 35px;
		margin-bottom: 30px;
	}
	#store .tit_store_name span{
		font-size: 20px;
	}
	#store .tit_store,
	#store .tit_store_name,
	#store .txt_store{
		width: 52%;
		max-width: 570px;
		float: right;
	}
	#store .photo_store,
	#store .box_sns{
		width: 44%;
		max-width: 450px;
		float: left;
	}
	#store .txt_store p{
		font-size: 18px;
		margin-bottom: 30px;
	}
	#store .list_sns{
		margin-top: 10px;
	}
	#store .list_sns a{
		padding: 15px 0;
		font-size: 16px;
	}
	#store .list_sns a:hover{
		background-color: #62491c;
	}
	#store .list_sns .bt_tw a{
		background-size: 25px;
	}
	#store .list_sns .bt_fb a{
		background-size: 12px;
	}
	#store .list_sns .bt_insta a{
		background-size: 25px;
	}
	#store .list_sns .bt_ameblo a{
		background-size: 22px;
	}
}
@media screen and (max-width: 736px){
	#store .content_inner{
		width: 90%;
		padding: 10px 0 0;
	}
	#store .layout_store{
		padding: 35px 20px;
		display: flex;
		flex-wrap:wrap;
	}
	#store .tit_store{
		margin-bottom: 20px;
	}
	#store .tit_store_name{
		font-size: 27px;
	}
	#store .tit_store_name span{
		font-size: 14px;
	}
	#store .txt_store p{
		font-size: 16px;
		margin-bottom: 20px;
	}
	#store .tit_store,
	#store .tit_store_name,
	#store .txt_store{
		width: 94%;
		margin: 0 auto 30px;
	}
	#store .photo_store{
		width: 84%;
		margin: 0 auto 30px;
		order: 2;
	}
	#store .tit_store{
		order: 1;
	}
	#store .tit_store_name{
		order: 3;
	}
	#store .txt_store{
		order: 4;
	}
	#store .box_sns{
		order: 5;
		width: 100%;
		font-size: 11px;
	}
	#store .list_sns{
		margin-top: 15px;
	}
	#store .list_sns a{
		padding: 13px 0;
		font-size: 11px;
	}
	#store .list_sns .bt_tw a{
		background-size: 18px;
	}
	#store .list_sns .bt_fb a{
		background-size: 9px;
	}
	#store .list_sns .bt_insta a{
		background-size: 18px;
	}
	#store .list_sns .bt_ameblo a{
		background-size: 17px;
	}
}