@charset "utf-8";
@import url("basic.css");


/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, 
img{vertical-align:top;}
a img:hover{opacity:.8;}
table {width:100%;border-collapse: separate;border-spacing: 0;}
td,th{vertical-align: middle;}
a img {border: 0;transition:all 0.3s;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}


* {
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 -o-box-sizing: border-box;
 -ms-box-sizing: border-box;
  box-sizing: border-box;
}

body{
	color:#666;
	background:#fff;
	font-family: "メイリオ", "Meiryo", arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	font-size: 16px;
	margin:0;
	line-height:1.6;
	text-align: justify; text-justify: inter-ideograph;
}
h1{display:none;}
.fadein {opacity : 0;transform: translateY(20px);transition: all 1s;}

/* レイアウト
------------------------------------------------------------*/
#wrapper{margin:0 auto;width:100%;padding:0;}

#content{margin:0 auto;width:1080px;padding:0;}



#footer{clear:both;width:100%;padding:20px 0;display: inline-block;vertical-align: middle;} 


.topimg_box{text-align:center;margin:0 auto 0px;background:#F8F5EC;padding:20px 0;}
.img_box{text-align:center;margin:0 auto 90px;}
.btn_img{text-align:center;margin:0 auto 90px;}
.btn_img img{width:260px;}
.text_area{text-align:center;font-size:20px;margin:0 auto 90px;}
.about_box{width:40%;display:table;margin:0 auto 90px;}
.about_inbox{display:table-row;}
.about_left{width:40%;display:table-cell;vertical-align: middle;padding-bottom:30px;}
.about_right{width:60%;display:table-cell;vertical-align: middle;padding-bottom:30px;}


/* フッター
*****************************************************/

#copyright{clear:both;padding:20px 0;text-align:center;font-size:90%;}

.frame {margin:0 0 30px;}



/* 1079px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 1079px){
#wrapper{width:95%;margin:0 auto;}
#content{margin:0 auto;width:100%;padding:0;}
.img_box img{width:100%;}
.topimg_box img{width:100%;}
}


/* 650px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 650px){
.about_box{width:80%;display:block;margin:0 auto 30px;}
.about_inbox{display:block;}
.about_left{width:100%;display:block;padding-bottom:0px;font-weight:bold;}
.about_right{width:100%;display:block;padding-bottom:15px;}
.img_box{margin:0 auto 40px;}
.btn_img{margin:0 auto 20px;}
.text_area{font-size:16px;margin:0 auto 40px;}
}