@charset "UTF-8";
/* Reset Stylesheet Based on - html5doctor.com Reset Stylesheet http://html5doctor.com/html-5-reset-stylesheet/ */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, 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; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
table { border-collapse: collapse; border-spacing: 0; }
input, select { vertical-align: middle; }
ul, li { list-style: none; }
/*-------------------------------------
basic
-------------------------------------*/
html { /*overflow-x: hidden;*/ }
body { font-family: "Oswald", sans-serif, Arial, Helvetica, Verdana, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック"; font-size: 75%; line-height: 1.5; font-weight: 300; letter-spacing: 1px; -webkit-text-size-adjust: 100%; }
a { text-decoration: none; cursor: pointer; color: rgb(0,100,210); }
a:hover { text-decoration: underline; }
img { vertical-align: bottom; }
h1 { font-size: 60px; line-height: 1.2; }
h2 { font-size: 40px; }
h3 { font-size: 24px; }
p, ul, dl, table, input, select { font-size: 16px; }

/*-------------------------------------
header
-------------------------------------*/
header { width: 80%; z-index: 1; padding: 20px 10%; }
header #logo { float: left; }
header #tel { float: right; }
header .button { margin-left: 30px; float: right; font-size: 15px; letter-spacing: 3px; }
header .button a { width: 180px; padding: 10px 0px 9px; float: left; text-align: center; color: rgb(0,0,0); background: rgb(255,255,255); border: 2px solid rgb(0,0,0); transition: all 0.1s ease-in-out 0s; }
header .button a:hover { color: rgb(255,255,255); background: rgb(0,0,0); border: 2px solid rgb(0,0,0); text-decoration: none; }

/*-------------------------------------
visual
-------------------------------------*/
#visual { width: 100%; min-height: 690px; position: relative; overflow: hidden; }
#visual h1 { padding: 15px 0px; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); font-size: 46px; font-weight: 500; letter-spacing: 3px; }
#visual .bxslider li { width: 100%; }
#visual .bxslider li img { width: 980px; margin: 0px auto; }
#visual .bxslider li.visual1 { background: rgb(0,0,0) url(../images/visual1_bg.jpg) repeat-x; }
#visual .bxslider li.visual2 { background: rgb(255,120,0) url(../images/visual2_bg.jpg) repeat-x; }

/*-------------------------------------
contents
-------------------------------------*/
#contents { width: 100%; /*max-height: 100%;*/ }
.title { background: rgb(0,0,0); }
.title h1 { padding: 15px 0px 25px; text-align: center; color: rgb(255,255,255); font-weight: 300; letter-spacing: 5px; }
.title h1 span { padding-top: 5px; display: block; font-size: 18px; }
.content { display: block; padding-top: 30px; }
.inner { width: 980px; margin-right: auto; margin-left: auto; }
.note { text-align: center; font-size: 18px; font-weight: 700; padding-bottom: 40px; }

footer{clear: both;background: #eee;}
#wp_footer_link{}
/*-------------------------------------
nav
-------------------------------------*/
nav { width: 981px; margin: 0px auto 50px; }
nav ul { margin-top: 30px; border-right: 3px solid rgb(0,0,0); border-bottom: 3px solid rgb(0,0,0); }
nav li { width: 326px; float: left; text-align: center; font-size: 24px; font-weight: 500; }
nav li span { display: block; font-size: 16px; }
nav li a { padding: 10px; border-top: 3px solid rgb(0,0,0); border-left: 3px solid rgb(0,0,0); display: block; color: rgb(0,0,0); transition: all 0.1s ease-in-out 0s; }
nav li a:hover { text-decoration: none; color: rgb(255,255,255); background: rgb(0,0,0); }
nav p { padding: 30px 0px 30px 60px; background: rgb(0,0,0); position: relative; }
nav span { display: block; font-size: 16px; }
nav .button { width: 290px; font-size: 24px; font-weight: 500; letter-spacing: 5px; position: absolute; top: 22px; right: 50px; }
nav .button a { padding: 10px; display: block; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); border: 2px solid rgb(255,255,255); transition: all 0.1s ease-in-out 0s; }
nav .button a:hover { color: rgb(0,0,0); background: rgb(255,255,255); border: 2px solid rgb(255,255,255); text-decoration: none; }

/*-------------------------------------
about
-------------------------------------*/
#about { width: 100%; margin-bottom: 60px; }
#about .content { background: url(../images/about_bg.jpg) repeat-x; }
#about .note { padding-bottom: 0px; }
#about h2 { padding: 10px 0px; text-align: center; font-size: 50px; font-weight: 300; letter-spacing: 3px; border-top: 3px solid rgb(0,0,0); border-bottom: 3px solid rgb(0,0,0); }
#about ul { margin: 30px 0px 0px -25px; }
#about li { width: 310px; padding-top: 162px; margin-left: 25px; float: left; text-align: left; display: block; }
#about li span { padding: 12px; display: block; text-align: center; font-weight: bold; font-size: 24px; }
#about li.point1 { background: url(../images/about1.jpg) no-repeat top; }
#about li.point2 { background: url(../images/about2.jpg) no-repeat top; }
#about li.point3 { background: url(../images/about3.jpg) no-repeat; }

/*-------------------------------------
portfolio
-------------------------------------*/
#portfolio { width: 100%; }
#portfolio .content { padding: 0; }
#portfolio ul { display: block; }
#portfolio li { width: 25%; float: left; overflow: hidden; }
#portfolio li img { width: 100%; transition: 0.5s; }
#portfolio li img {
	-moz-transition: -moz-transform 0.5s linear;
  -webkit-transition: -webkit-transform 0.5s linear;
	-o-transition: -o-transform 0.5s linear;
	-ms-transition: -ms-transform 0.5s linear;
	transition: transform 0.5s linear;
}
#portfolio li img:hover {
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

/*-------------------------------------
item
-------------------------------------*/

#pamphlet .cover { background: rgb(0,0,0) url(../images/cover_pamphlet.png) no-repeat center top; background-size: cover; }
#corporateguide .cover { background: rgb(0,0,0) url(../images/cover_corporateguide.png) no-repeat center top; background-size: cover; }
#leaflet .cover { background: rgb(0,0,0) url(../images/cover_leaflet.png) no-repeat center top; background-size: cover; }
#catalog .cover { background: rgb(0,0,0) url(../images/cover_catalog.png) no-repeat center top; background-size: cover; }
#flyer .cover { background: rgb(0,0,0) url(../images/cover_flyer.png) no-repeat center top; background-size: cover; }
#poster .cover { background: rgb(0,0,0) url(../images/cover_poster.png) no-repeat center top; background-size: cover; }
.item { width: 100%; margin-bottom: 60px; }
.item .cover { min-height: 436px; color: rgb(255,255,255); }
.item .cover .note { padding: 0px 0px 30px; }
.item .cover .left { float: left; width: 500px; }
.item .cover .right { float: right; width: 500px; }
.item .cover h3 { font-size: 24px; }
.item .cover p { padding-top: 10px; }
.item .spec { margin-bottom: 30px; }
.item .open { background: rgb(0,0,0); text-align: center; padding: 15px; color: rgb(255,255,255); cursor: pointer; font-size: 24px; transition: all 0.1s ease-in-out 0s; }
.item .open:hover { background: rgb(220,0,0); }
.item .close { background: rgb(0,0,0); text-align: center; padding: 10px; color: rgb(255,255,255); cursor: pointer; font-size: 24px; width: 200px; margin: 40px auto 0px; transition: all 0.1s ease-in-out 0s; }
.item .close:hover { background: rgb(220,0,0); }
.item .wrap { display: none; }
.item .box { margin-top: 30px; }
.item h3 { font-size: 34px; font-weight: 300; line-height: 1; letter-spacing: 3px; }
.item h3 span { margin-left: 10px; font-size: 16px; letter-spacing: 1px; vertical-align: 30%; }
.item .block { display: block; margin-top: 20px; }
.item .photo { width: 400px; height: 280px; float: left; }
.item .detail { width: 520px; float: right; }
.item .detail dl { margin-top: 10px; }
.item .detail dt { width: 70px; padding: 2px 0px; margin-top: 8px; float: left; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); }
.item .detail dd { width: 390px; padding: 2px 0px; margin: 8px 0px 0px 20px; float: left; }
.item table { width: 100%; text-align: center; margin-top: 5px; }
.item thead td { width: 25%; padding: 10px; border: 2px solid rgb(0,0,0); background: rgb(245,245,245); font-weight: 700; vertical-align: middle; }
.item tbody td { width: 25%; padding: 10px; border: 2px solid rgb(0,0,0); vertical-align: middle; }

/*-------------------------------------
option
-------------------------------------*/
#option { width: 100%; margin-bottom: 60px; }
#option table { width: 100%; }
#option thead td { padding: 15px 20px; text-align: center; font-weight: 700; background: rgb(245,245,245); border: 2px solid rgb(0,0,0); vertical-align: middle; }
#option tbody td { padding: 15px 20px; border: 2px solid rgb(0,0,0); vertical-align: middle; }

/*-------------------------------------
flow
-------------------------------------*/
#flow { width: 100%; margin-bottom: 60px; }
#flow ul { margin-left: -15px; }
#flow li { border: 3px solid #000; width: 178px; float: left; margin-left: 15px; text-align: center; background: #000; color: #FFF; font-weight: bold; }
#flow li span { min-height: 300px; display: block; padding: 12px; text-align: left; background: #FFF; color: #000; margin-top: 10px; font-weight: normal; font-size: 16px; }
#flow li img { float: left; }

/*-------------------------------------
faq
-------------------------------------*/
#faq { width: 100%; margin-bottom: 60px; }
#faq h3 { margin-bottom: 10px; padding-top: 30px; border-top: 3px solid rgb(230,230,230); }
#faq dl { display: block; }
#faq dt { padding: 20px 20px 20px 60px; font-size:18px; font-weight: bold; background: url(../images/qa_q.png) no-repeat left 15px; cursor: pointer; }
#faq dd { padding: 30px 20px 30px 80px; margin-bottom: 10px; font-size: 16px; background: rgb(245,245,245) url(../images/qa_a.png) no-repeat 20px 20px; display: none; }

/*-------------------------------------
company
-------------------------------------*/
#company { width: 100%; margin-bottom: 60px; }
#company table { width: 100%; background: rgb(255,255,255); }
#company table th { width: 30%; padding: 25px; text-align: left; border: 2px solid rgb(0,0,0); }
#company table td { width: 70%; padding: 25px; border: 2px solid rgb(0,0,0); font-weight: lighter; }

/*-------------------------------------
contact
-------------------------------------*/
#contact { width: 100%; margin-bottom: 60px; }
#contact h3 { margin-bottom: 10px; }
#contact table { width: 100%; }
#contact table th { width: 30%; padding: 25px; border: 2px solid rgb(0,0,0); vertical-align: middle; text-align: left; }
#contact table td { width: 70%; padding: 25px; border: 2px solid rgb(0,0,0); }
#contact table span { color: rgb(255,0,0); font-size: 14px; font-weight: normal; }
#contact #submit, #contact #submit_button, #contact #back_button { padding: 15px 30px; font-size: 18px; color: rgb(255,255,255); background: rgb(0,0,0); border: 2px solid rgb(0,0,0); cursor: pointer; transition: all 0.1s ease-in-out 0s; }
#contact #submit:hover, #contact #submit_button:hover, #contact #back_button:hover { background: rgb(220,0,0); border: 2px solid rgb(220,0,0); }

/*-------------------------------------
footer
-------------------------------------*/
footer { width: 100%; }
footer #copyright { padding: 20px 0px; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); }

/*-------------------------------------
clearfix
-------------------------------------*/
.clearfix:before,.clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/*-------------------------------------
WordPressフッターリンク
-------------------------------------*/
#wp_footer_link { padding: 20px; text-align: center; max-width:980px;font-family:Meiryo,"メイリオ",sans-serif;margin: auto;}
#wp_footer_link div { display: inline; margin: 0 10px 10px 10px; }
#wp_footer_link h3 { padding: 10px;width: auto; margin: 0; font-size: 1em; font-weight: normal; text-shadow: none; background: #000;color: #fff;}
#wp_footer_link h3 a{color:#fff;font-size: 18px;}
#wp_footer_link a { color: #000; text-decoration: none; }
#wp_footer_link a:hover { text-decoration: none; }

#wp_footer_link ul{zoom:1;}
#wp_footer_link ul:after{content:"";display:block;height:0;clear:both;}
#wp_footer_link li{width:162px;float:left;border-top:solid 1px #333;border-right:solid 1px #333;border-bottom:solid 1px #333;}
#wp_footer_link li:first-child{border-left:solid 1px #333;}
#wp_footer_link li a{display:block;padding:30px 10px 5px;height:60px;}
#wp_footer_link li:first-child a{padding:20px 10px 15px;}
#wp_footer_link li a:hover{background:#eee;}