@charset "UTF-8";

/*////////////////////////////////////////////////////////////////////////////////// Init */

body {
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;
}

body { font-size:16px; line-height:1.6em; background-color:#ffffff;  }
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }

li { list-style:none; }

header,footer,hgroup,section,article,aside,figure,figcaption,summary,time,nav { display:block; margin:0; padding:0; }

/*////////////////////////////////////////////////////////////////////////////////// */
body { font-size: 17px; color: #878787; }

@media (max-width:1020px) { body { font-size: 17px; } }
@media (max-width:920px) { body { font-size: 16.5px; } }
@media (max-width:820px) { body { font-size: 16px; } }
@media (max-width:720px) { body { font-size: 15.5px; } }
@media (max-width:620px) { body { font-size: 15px; } }
@media (max-width:520px) { body { font-size: 14.5px; } }
@media (max-width:420px) { body { font-size: 14px; } }

.smart a:hover,
.smart a:active {
    outline: none;
}

.clear:after { display:block; clear:both; }
.clear { zoom:1; }
.clear:after { content:""; }

.c2 { letter-spacing: 1em; }

.frame { width: 100%; max-width: 1000px; margin: 0 auto; }
@media (max-width:1040px) {
	.frame { width: auto; padding: 0 20px; } 
}

nav { display: inline-block; margin: 1em 0; }
nav ul:after { display:block; clear:both; }
nav ul { zoom:1; }
nav ul:after { content:""; }
nav li { float: left; margin: 0.5em 0; }
nav li+li { border-left: solid 1px #ccc; }
nav li a { display: block; padding: 0 1em; line-height: 1em; color: #878787; text-decoration: none; }
nav li a:hover { color: #0099CC; }

header { text-align: right; }

#message { text-align: center; }
#message h2 { font-size: 1.5em; }
#message h2 > span { display: block; margin: 12% 0; }
#message h2 img { display: block; max-width: 240px; margin: 0 auto; }
#message h2 > span+span,
#message h2 > span+span span { display: inline-block; margin: 0; line-height: 1.4em; font-weight: bold; color: #0099CC; }
#message strong { display: block; margin: 2em 0 4em 0; font-size: 1.15em; line-height: 1.8em; font-weight: bold; }
#message strong span { display: inline-block; }

@media (max-width:920px) {
	#message strong { text-align:justify; text-justify:inter-ideograph; }
	#message strong span { display: inline; }
}

section { position: relative; margin: 3em 0; padding: 1em 15% 1em 20%; border-top: solid 1px #ccc; }
section h3 { position: absolute; top: -1.3em; left: 0; font-size: 1.2em; line-height: 1em; color: #0099CC; font-weight: bold; }
section a { color: #878787; }

@media (max-width:520px) {
	section { padding: 1em 3%; }
}

#company {}
#company h1 { font-size: 1.4em; letter-spacing: 0.05em; color: #0099CC; font-weight: bold; }
#company address { margin: 1em 0; padding-bottom: 1em; border-bottom: solid 1px #ccc; }
#company address p { line-height: 1.2em; }
#company address span { display: inline-block; margin-right: 0.5em; }
#company address p+dl { margin-top: 0.5em; }
#company address dl:last-child { margin-top: 0.5em; }
#company dl:after { display:block; clear:both; }
#company dl { zoom:1; }
#company dl:after { content:""; }
#company dt { float: left; min-width: 5em; }
#company dt::before { content: '・'; letter-spacing: 0; }
#company dd { float: left; padding-left: 1em; }
#company dd ul,
#company dd small { display: inline-block; vertical-align: bottom; }
#company dl+p { margin-top: 1em; text-align: center; }

#access {}
#access img { display: block; width: 100%; max-width: 700px; margin: 0 0 0 auto; }
#access img+div { margin-top: -3%; }
#access li { margin-left: 1em; text-indent: -1em; }
#access li::before { content: '●'; }
@media (max-width:1040px) {
	#access img+div { margin-top: 2%; }
}
@media (max-width:720px) {
}

#contact {}
#contact h2 { font-size: 1.2em; color: #0099CC; font-weight: bold; }
#contact h2+div { margin: 1em 0; }
#contact form { display: block; max-width: 600px; }
#contact label { display: block; margin-top: 1em; }
#contact label span { display: block; }
#contact input[type="text"],
#contact textarea { width: 100%; padding: 0.3em 0.5em; font-size: 16px; border: solid 1px #ccc; 
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
}
#contact p { margin: 0.5em 0; font-size: 0.8em; line-height: 1.3em; }
#contact .cb { float: left; margin-top: 0; }
#contact button { float: right; font-size: 1.1em; line-height: 30px; padding: 2px 3em; color: #fff; background: #aaa; border: none; cursor: pointer; }

#contact dl { clear: both; margin-bottom: 1em; padding-top: 1em; }
#contact dl+dl { border-top: solid 1px #ccc; }
#contact dt {}
#contact dd { margin-left: 1em; }
#contact form+form button { float: left; }

#contact .error { color: #f00; }
#contact .tb { font-size: 16px; cursor: pointer; }
#contact .tb input { padding: 0.5em; margin: 0; font-size: 16px; border: solid 1px #ccc; }
#contact .tb input:focus { border:solid 1px #0099CC; }
#contact .ta { font-size: 16px; cursor: pointer; }
#contact .ta textarea { height: 6em; font-size: 16px; border: solid 1px #ccc; }
#contact .ta textarea:focus { border:solid 1px #0099CC; }
#contact .cb { display: inline-block; font-size: 16px; cursor: pointer; }
#contact .cb input { display: none; }
#contact .cb span { display: block; position: relative; padding: 0.3em 1em 0.2em 2.7em; }
#contact .cb span::before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 2em; height: 2em; border: solid 1px #ccc; }
#contact .cb input:checked + span::before { background: #0099CC; }
#contact .cb span::after { content: ''; display: block; position: absolute; top: 0.35em; left: 0.2em; width: 0.5em; height: 1em; border-right: solid 3px #ddd; border-bottom: solid 3px #ddd; transform-origin:right bottom; transform: rotate(45deg); }
#contact .cb input:checked + span::after { border-color: #fff; }

#privacy { clear: both; max-width: 600px; padding-top: 2em; }
#privacy h4 { padding-top: 1em; font-weight: bold; border-top: solid 1px #ccc; }
#privacy p { font-size: 0.8em; line-height: 1.3em; text-align:justify; text-justify:inter-ideograph; }
#privacy ul {}
#privacy li { font-size: 0.8em; line-height: 1.3em; text-indent: -1em; margin-left: 1em; text-align:justify; text-justify:inter-ideograph; }
#privacy small { font-size: 12px; line-height: 1.2em; }

footer { text-align: center; }
footer::before { content: ''; display: block; border-top: solid 1px #ccc; }
footer nav li { border-left: solid 1px #ccc; }