@charset "UTF-8";
/* RESET - ADAPTED FROM MEYER RESET URL - http://meyerweb.com/eric/tools/css/reset/ LICENSE - PUBLIC DOMAIN */
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, caption, canvas, center, cite, code,dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, main, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td,u, ul, var, video{font-family:inherit;font-size:100%;font-weight:inherit;font-style:inherit;vertical-align:baseline;margin:0;padding:0;border:0;outline:0;background:transparent;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{display:block;}ol, ul{list-style:none;}blockquote, q{quotes:none;}table{border-collapse:collapse;border-spacing:0;}body{line-height:1;}
/* YUI 3.14.1 (build 63049cb) Copyright 2013 Yahoo! Inc. All rights reserved. Licensed under the BSD License. http://yuilibrary.com/license/ */
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif}table{font-size:inherit;font:100%}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}#yui3-css-stamp.cssfonts{display:none}
/*12 COLUMN :RESPONSIVE GRID SYSTEM DEVELOPER :DENIS LEBLANC URL :http://responsive.gs VERSION :3.0 LICENSE :GPL & MIT */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.container{width:100%; max-width:1120px; margin:0 auto; padding:0 6%;}
.container:after,.row:after,.col:after,.clr:after,.group:after{content:"";display:table;clear:both;}
.row{padding:auto; margin:0 auto;}
.col{display:block;float:left;width:100%;}
@media(min-width:769px){
	.container{width:1120px; padding:0 20px;}
}
@black:#111;
@white:#FFF;
@gray:#999;
@grayD:#444;
@grayL:#ccc;
@grayLL:#eee;
@red:#e60019;
@green:#0d5514;
@ncc:no-repeat center center;

// MIXIN
.trans{-webkit-transition:0.4s; -moz-transition:0.4s; -o-transition:0.4s; -ms-transition:0.4s; transition:0.4s;}
.fb{font-weight:bold;}
.tac{text-align:center;}
.tar{text-align:right;}
.tdn{text-decoration:none;}
.tdu{text-decoration:underline;}
.bgsc{-webkit-background-size:cover; -moz-background-size:cover; -ms-background-size:cover; -o-background-size:cover; background-size:cover;}
.inline{display:-moz-inline-box; display:inline-block;}

/*BASE*/
html,body{width:100%; height:auto; margin:0; padding:0;}
body{color:@black; background:@white; line-height:1; -webkit-text-size-adjust:100%; font-weight:normal; font-size:15px;
font-family:"Noto Sans JP","Helvetica Neue","Droid Sans",Lato,Arial,"游ゴシック",YuGothic,"游ゴシック体","游ゴシック Medium","Yu Gothic Medium","Hiragino Sans","ヒラギノ角ゴシック","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
background:url("../_img/bg/bgs.jpg") repeat center top; background-size:586px auto;}
img{max-width:100%; height:auto; vertical-align:middle;}
/*CF*/
.cf:before,.cf:after{content:" ";display:table;}.cf:after{clear:both;}.cf{*zoom:1;}

/*LETTER*/
strong{.fb()}
.attention{color:@red;}
.fontsmall{font-size:85%;}
.large{font-size:124%;}
.italic{font-style:italic;}
::selection{background:@black; color:@white;}
::-moz-selection{background:@black; color:@white;}

/*LINK*/
a:link{color:@red; .tdu(); .trans();}
a:visited{color:@red; .tdu();}
a:hover{color:@grayL; .tdu();}
a:active{color:@red; .tdu();}
a img{border:none; .tdn();}
a img:hover{border:none; opacity:0.6; .tdn();}

/*HEADER*/
header{}

/*LAYER*/
main{padding:9% 0 0; margin:0;}

/*PAGE TITLE*/
section.pagettl{margin:0 auto; background:@black;}

/*PAGE*/
div.pagebody{margin:0 auto 15%;
	article{margin:0 auto 9%;
		h3.pttl{font-size:21px; margin:0 0 6%; .fb(); .tac(); padding:20px 0; color:@white; text-box-trim:trim-both; text-box-edge:cap alphabetic;
			background:url("../_img/bg/r.jpg") repeat top center; background-size:600px auto;
		}
		h4{font-size:18px; margin:0 0 2%; line-height:1.7; .fb();}
		section.grbox{border:4px solid @green; border-radius:36px; padding:15px; margin:0 0 6%;
			background:url(../_img/bg/note.webp) repeat top left;
			background-size:500px auto;
			h4{color:@green; .tac();}
			p{font-size:14px; margin:0; .tac(); .fb();}
		}
		p{word-wrap:break-word; line-height:1.7; margin-bottom:6%;}
		table{width:100%; font-size:13px; line-height:1.7; background:@white;
			tr{width:100%;
				th{padding:10px; .fb(); color:@black; background:@grayLL; text-align:left; border:1px solid @gray; white-space:nowrap;}
				td{padding:10px; border:1px solid @gray;}
			}
		}
		ul.feature{
			li{background:#fff; border-radius:12px; .tac(); margin:0 0 20px; padding:15px;
				h4{color:@green;}
				p{margin:0;}
			}
		}
		ul.flow{
			li{position:relative; background:#fff; border-radius:12px; .tac(); margin:0 0 20px; padding:12px;
				h4{font-size:16px; margin:0; color:#752100;}
				p{font-size:12px; margin:0; color:#752100;}
			}
			li::after{content:""; background:#ffbf7f; width:10px; height:20px; display:block; position:absolute; bottom:-20px; left:50%; transform:translateX(-50%);}
			>li:nth-child(7)::before{content:""; background:#ffbf7f; width:10px; height:20px; display:block; position:absolute; bottom:-20px; right:22.5%;}
			>li:nth-child(7)::after{left:22.5%; transform:translateX(0);}
			>li:last-child::after{content:none;}
			ul.flows{
				display:flex;
				flex-flow:row nowrap; 
				justify-content:space-between;
				align-items:flex-start;
				>li:first-child{background:none; padding:0; margin:0}
				>li:first-child::after{content:none;}
				>li:last-child{padding:15px 6px; margin:0; height:101.38px;}
				>li{width:47%; 
					ul{
						li{padding:6.5px;}
					}
				}
			}
		}
	}
	article.greet{
		section{
			h4{.tac();
				span{font-size:13px; display:block;}
			}
		}
		section:first-child{margin:0 0 9%;}
		section:last-child{width:60%; margin:0 auto;
			img{margin:0 0 3%;}
		}
	}
	section.bttl{background:url("../_img/bg/n.jpg") repeat; background-size:500px auto;
		display:flex;
		flex-flow:row nowrap; 
		justify-content:space-between;
		align-items:center;
		padding:20px 22px; border-radius:12px; margin:0 0 9%;
		img{width:30%;}
		h2{font-size:21px; line-height:1.5; white-space:nowrap; .fb();}
	}
	article.brand{padding:15px; background:url("../_img/bg/w.jpg") repeat; background-size:880px auto;}
	article.con{
		p{.tac();}
		h4{.tac(); color:@green; margin:0 0 6%;}
	}
	div.imgbox{
		display:flex;
		flex-flow:row wrap; 
		justify-content:space-between;
		align-items:flex-start;
		img{width:48%;}
	}
	div.img6{
		img{margin:0 0 15px;}
		img:nth-child(5){margin:0;}
		img:nth-child(6){margin:0;}
	}
	ul.menu{
		li{
			img{margin:0 0 2%;}
			h4{color:#752100;}
		}
	}
}

div.btn{width:88%; margin:0 auto 9%; font-size:21px; letter-spacing:1px; color:@white; .tac(); .fb();
	a{display:block; padding:24px 0; border-radius:72px; background:#ff6600; box-shadow:0px 0px 15px rgba(136,136,136,0.3);}
	a:link{color:@white; .tdn();}
	a:visited{color:@white; .tdn();}
	a:hover{background:@green; color:@white; .tdn();}
	a:active{color:@white; .tdn();}
}

/*FOOTER*/
footer{width:100%; padding:30px 0; color:@white; background:@black; .tac();
	div.footlogo{width:90px; margin:0 auto 20px;}
	small{display:block; font-size:12px;}
}

/****************************************************/
/************************ PC ************************/
/****************************************************/
@media(min-width:769px){
html,body{min-width:1120px;}
body{font-size:16px;}
.sp{display:none;}

/*LAYER*/
main{padding:60px 0 0; margin:0;}
/*PAGE*/
div.pagebody{margin:0 auto 120px;
	article{margin:0 auto 60px;
		h3.pttl{font-size:28px; margin:0 0 36px; padding:30px 0;}
		h4{font-size:20px; margin:0 0 12px;}
		section.grbox{border:5px solid @green; border-radius:42px; padding:18px; margin:0 0 30px;
			h4{font-size:21px;}
			p{font-size:16px;}
		}
		p{word-wrap:break-word; line-height:1.8; margin-bottom:30px;}
		table{font-size:15px;
			tr{
				th{padding:15px;}
				td{padding:15px;}
			}
		}
		ul.feature{
			display:flex;
			flex-flow:row nowrap; 
			justify-content:space-between;
			li{width:24%; margin:0 0 20px; padding:15px;
				h4{color:@green;}
				p{margin:0;}
			}
		}
		ul.flow{width:80%; margin:0 auto;
			li{border-radius:16px; margin:0 0 30px; padding:15px;
				h4{font-size:18px;}
				p{font-size:14px;}
			}
			li::after{height:30px; bottom:-30px;}
			>li:nth-child(7)::before{height:30px; bottom:-30px; right:23.5%;}
			>li:nth-child(7)::after{left:23.5%; transform:translateX(0);}
			ul.flows{
				>li:last-child{padding:30px 10px; margin:0; height:123px;}
				>li{width:48%; 
					ul{
						li{padding:8px;}
					}
				}
			}
		}
	}
	article.greet{
		div{
			display:flex;
			flex-flow:row-reverse nowrap; 
			justify-content:space-between;
			align-items:flex-start;
		}
		section:first-child{width:70%; margin:0;}
		section:last-child{width:24%; margin:0;
			img{margin:0 0 15px;}
		}
		section{
			h4{font-size:17px; .tac();
				span{font-size:12px;}
			}
		}
	}
	section.bttl{background:url("../_img/bg/n.jpg") repeat; background-size:100% auto;
		justify-content:center;
		padding:45px 60px; margin:0 0 60px;
		img{width:20%; margin:0 6% 0 0;}
		h2{font-size:34px;}
	}
	article.brand{padding:30px; background:url("../_img/bg/w.jpg") repeat; background-size:100% auto;}
	article.con{
		p{font-size:17px; .fb();}
		h4{font-size:24px; margin:0 0 30px;}
	}
	div.imgbox{
		img{width:49%;}
	}
	div.img6{
		img{width:32%; margin:0 0 15px;}
		img:nth-child(4){margin:0;}
	}
	ul.menu{
		li{margin:0 0 30px;
			display:flex;
			flex-flow:row nowrap; 
			justify-content:space-between;
			align-items:flex-start;
			img{width:30%; margin:0;}
			section{width:67%;}
			h4{color:#752100;}
		}
	}
}

div.btn{width:60%; margin:0 auto 60px; font-size:30px; letter-spacing:2px;
	a{padding:30px 0;}
}

/*FOOTER*/
footer{padding:40px 0; 
	div.footlogo{width:120px; margin:0 auto 30px;}
	small{font-size:14px;}
}

}
/************************ SP ************************/
@media(max-width:768px){
	.pc{display:none;}
	.spmb{margin-bottom:6%;}
	/*PAGE TITLE*/
	section.pagettl{
		div.container{padding:0;}
	}
}