/*
Theme Name:fgs
Theme URI:https://fgs.com/
Author:mizuho ogino
Author URI:http://web.contempo.jp
*/

@charset "UTF-8";



/* Color & Typography */

html,body{ position:relative; }
html.theme { background:#fff; }
body *, *::before, *::after { border-color:#e9e9e9; border-color:rgba(0,0,0,.1); }
#wrapper { padding-left:180px; }

@media only screen and ( max-width:782px ) { 
  html { position:static; } 
  body { width:100%; height:100%; overflow-x:hidden; overflow-y:auto; position:absolute; -webkit-overflow-scrolling:touch; z-index:1; }
}
.container { overflow:visible; max-width:1200px; padding:56px 40px 64px; margin:0 auto; background:transparent; }
h1 { font-weight:normal; font-size:1.7em; }
h2 { font-weight:normal; font-size:1.5em; }
h3 { font-weight:bold; font-size:1.2em; }
.entry strong { font-size:1.2em; font-weight:normal;  }
/* Linked items */
a, a::after, a::before, a * { color:inherit; border-color:inherit; transition:width .25s; }
a.hover, a.hover::before, a.hover::after, a:hover, a:hover::before, a:hover::after, a.current, span.current { border-color:#bee3f2; color:#0084c1; }
a.text-link { color:inherit; border-bottom:1px solid #64bcb3; display:inline-block; text-decoration:none; }
a.text-link:hover { border-bottom:1px solid #0084c1;  }

input, textarea { background-color:#f9f9f9 }
button, input[type="button"], input[type="reset"], input[type="submit"], a.button { text-align:center; margin-top:8px; background:#414444; border-radius:0; }
button:hover, .button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover, a.contact:hover { background:#0084c1!important; color:#fff; }
a.page-link { color:inherit; font-size:12px; line-height:1em; font-weight:normal; text-transform:uppercase; display:inline-block; min-width:8em; padding:8px 0 16px 0; margin:16px 0 0 0; position:relative; border-width:0; }
a.page-link::before { content:''; height:6px; width:100%; background:#414444; display:block; position:absolute; left:0; bottom:0; border-width:0; }
a.page-link::after { content:''; height:6px; width:0; background:#0084c1; display:block; position:absolute; left:0; bottom:0; border-width:0; transition:width .25s; }
a.page-link:hover::after { width:100%; }

span.mark-star { color:#64bcb3; }
span.mark-circle { color:#64bcb3; }
span.mark-square { color:#64bcb3; }
span.mark-notice { color:#414444; }

.phone { font-size:1.5em; color:#0c6184; font-weight:900; }
.phone i { color:#bee3f2; }
main { overflow:hidden; position:relative; }
.note { font-size:12px; }

.image, .image-wrap { overflow:hidden; }

ul li::before { background-color:#e9e9e9; color:#fff; }
ul li:hover::before { background-color:#bee3f2; }
ol li::before { background-color:#999; color:#fff; }
ol li:hover::before { background-color:#64bcb3; }

.entry a.button { color:#fff!important; border-width:0; min-width:180px; }


dl.info { border-top:0; border-left:0; border-right:0; border-bottom-style:dotted; }
dl.info dt { border-right:0; border-top-style:dotted; padding:16px; }
dl.info dd { border-left:0; border-top-style:dotted; padding:16px; }
dl.info dt:first-child { border-top:6px solid rgba(0,0,0,.3); }
dl.info dt:first-child + dd { border-top:6px solid rgba(0,0,0,.2); }
table { width:100%; height:auto; padding:0; border-collapse:collapse; border-width:2px; border-style:solid; }
table caption { padding:8px; line-height:1em; background-color:#f9f8f6; letter-spacing:1px; font-size:.91em; }
th, td { padding:.5em; border:1px solid #ccc; background:inherit; color:inherit; vertical-align:middle; }
thead > *, th { background-color:transparent; font-weight:bold; }
table tbody tr:nth-of-type(odd) { background:rgba(210,210,210,.2); }
table tr:last-child > * { border-bottom:0; }
td.td-image { padding:1em 2em; }



/* ::::::::::: HEADER CROWN & MENU ::::::::::: */
#site-header { padding:32px 24px; width:180px; margin:0; position:fixed; right:auto; left:0; bottom:0; top:0; text-align:center; z-index:101; background:#f9f9f9; transition:right .25s ease-in-out; }

#site-logo { display:block; text-align:center; padding:0; margin:auto; max-width:180px; }
#site-logo a { display:inline-block; }
#toggle-menu { display:none; }
#sub-navi { display:block; padding:24px; position:absolute; bottom:0; left:0; right:0; text-align:center; }
#sub-navi a { display:inline-block; height:28px; width:28px; margin:0 2px; opacity:.6;}
#sub-navi a.hover { opacity:1; }
#sub-navi i { font-size:28px; line-height:1em; width:1em; height:1em; vertical-align:middle; text-align:center; }
#sub-navi i::before, #sub-navi i::after { padding:0; margin:0; }
.toggle-button span { display:none; display:block; height:3px; background-color:#3b3b3b; position: absolute; right:44px; transition:.15s ease-in-out; }
.toggle-button.hover span { background-color:#0084c1; }
.toggle-button .bar-1 { top:46px; width:30px; }
.toggle-button .bar-2 { top:56px; width:22px; }
.toggle-button .bar-3 { top:66px; width:26px; }
body.toggle-opened { overflow:auto; }
body.toggle-opened .toggle-button .bar-1 { top:56px; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
body.toggle-opened .toggle-button .bar-2 { width: 0; }
body.toggle-opened .toggle-button .bar-3 { top:56px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); }
body.toggle-opened #site-header { right:0; }
#site-navi { display:block; padding:16px 0; margin:32px 0 0; border-width:1px 0; }
#site-navi li { padding:0; margin:0; display:block; }
#site-navi li > a { margin:0; padding:8px; position:relative; z-index:2; text-align:center; display:block; }
#site-navi a strong { line-height:1.2; font-size:16px; font-weight:normal; display:none; margin:0; padding:0; }
#site-navi a span.en { line-height:1.2; font-size:16px; text-transform:uppercase; display:block; margin:0; padding:0; font-weight:normal; }
#site-navi ul a i { display:none; }
#site-navi li.navi-home, #site-navi li.navi-contact { display:none; }


#home-screen { text-align:center; z-index:1; padding:0; background:transparent; height:540px; height:100vh; position:relative; } 
/*#image-wrapper { display:block; margin:0; padding:0; position:absolute; bottom:0; left:0; right:0; top:0; background:transparent; z-index:3; }*/
#home-screen::before { display:block; content:' '; position:fixed; bottom:0; left:0; right:0; top:0; background-color:rgba(0,70,190,.05); z-index:-1; }
#screen-image { position:fixed; left:180px; top:0; margin:auto; background:#eee url('images/front-bg.jpg') center bottom; background-size:cover; width:100%; height:100vh; z-index:0; }
#home-headlines { position:absolute; text-align:center; left:0; top:50%; right:0; height:0; z-index:9; font-size:1em; margin-top:-4em; }
#home-headlines h2 { font-size:3em; margin:0;  font-weight:bold; }
.headlines h2 { color:#fff; font-size:1.8em; line-height:1.1em; font-weight:800; text-transform:uppercase; letter-spacing:0; vertical-align:middle; padding:0; margin:0; text-shadow:0 0 4px rgba(0,0,0,.4); }
.headlines h1 { color:#222; color:rgba(0,0,0,.8); font-size:1.25em; line-height:1.1em; font-weight:normal; letter-spacing:0; vertical-align:middle; padding:0; margin:1em 0 0; text-shadow:0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff; }

@media only screen and ( min-width:1200px ){ 
  #site-header  { width:15%; } 
  #wrapper { padding-left:15%; }
  #screen-image { left:15%;  }
} 
@media only screen and ( min-width:935px ){ 
  body.toggle-opened #wrapper { position:static!important; top:0!important; } /*toggleメニュー時のbodyロックを強制解除*/

}
@media only screen and ( max-width:934px ){ 
  #site-header { padding:0; margin:0; width:auto; height:auto; border-width:0; position:static; }
  #wrapper { padding:0; border-width:0; width:100%; transition:margin-left .25s ease-in-out; }
  #screen-image { left:0; }
  #home-screen { margin-top:-152px; position:relative; }
  #home-headlines { position:absolute; text-align:left; left:0; top:auto; right:0; bottom:0; margin:0; height:auto; padding:16px; }

  #home-headlines h2 { font-size:4em; }
  #home-headlines h2 span { display:block; }
  #home-headlines h1 { display:none; }
  body.toggle-opened { height:100%; width:100%; overflow:hidden; }
  body.toggle-opened #wrapper { position:fixed; }
  #site-logo { display:block; position:relative; text-align:left; top:auto; left:auto; right:auto; bottom:auto; z-index:100; max-width:none; background:#fff; padding:16px; }
  #site-logo img { height:120px; width:auto; }
  #header-box { display:none; float:none; position:fixed; z-index:992; padding-bottom:56px; margin:0; top:0; bottom:0; left:0; right:0; width:100%; background:#fff; overflow-y:auto; overflow-x:hidden; }
  body.toggle-opened #header-box { display:block; }
  #sub-navi { border-width:0; }
  #sub-navi a { color:#999; margin:0 4px;}
  #sub-navi a.hover { color:#0084c1; }
  #toggle-menu { display:block; position:fixed; z-index:993; top:0; right:0; width:60px; height:60px; background:#fff; background:rgba(255,255,255,.9); }
  #toggle-menu span { right:14px; /*background-color:#fff;*/ opacity:.8;}
  #toggle-menu:hover span { background-color:#0084c1; }
  #toggle-menu .bar-1 { top:16px; width:30px; } 
  #toggle-menu .bar-2 { top:26px; width:22px; }
  #toggle-menu .bar-3 { top:36px; width:26px; }
  body.toggle-opened #toggle-menu { background:transparent; }
  body.toggle-opened #toggle-menu .bar-1 { top:26px; }
  body.toggle-opened #toggle-menu .bar-2 { width: 0; }
  body.toggle-opened #toggle-menu .bar-3 { top:26px; }
  #site-navi { border-width:0; position:static; }
  #site-navi > ul { position:static; margin:24px auto; width:540px; max-width:100%; border-width:0; }
  #site-navi .navi { padding:0; width:auto; margin:0; float:none; line-height:1em; vertical-align:middle; border-width:0; }
  #site-navi li.navi-home, #site-navi li.navi-contact { display:block; }
  #site-navi .navi + .navi::before { content:''; width:64px; margin:0 auto; display:block; border-bottom:1px solid #ccc; }
  #site-navi .navi > a { border-width:0; margin:4px; color:#666; z-index:2; text-align:center; padding:12px; min-width:0; border-radius:2px; }
  #site-navi .navi > a strong {}
  #site-navi .navi > a.hover { color:#0084c1; }
  #site-navi .navi > a span.en { font-size:2em; display:block; }
  #site-navi .navi-contact { display:block; }

}
@media only screen and ( min-width:782.1px ){ 
  .fadein { opacity:0; transform:translate(0, 100px); transition:opacity 1s, transform 1s; }
  .fadein.fadeinLeft { transform:translate(-100px, 0); }
  .fadein.fadeinRight { transform:translate(100px, 0); }
  .fadein.trigger { opacity:1; transform:translate(0, 0); }
}
@media only screen and ( max-width:782px ){ 
  .container { padding:40px 24px 48px; }
}
@media only screen and ( max-width : 600px ){ 
  h1 { font-size:1.6em; }
  #home-headlines h2 { font-size:14vw; }
  #site-navi .navi > a { padding:6px; } 
} 
@media only screen and ( max-width:480px ){  
  h1 { font-size:1.4em; }

  dl.info { border-top:0; border-left:0; border-right:0; border-width:0; display:block; }
  dl.info > dt { border-right:0; border-top:none; padding:4px; display:block!important; float:none; color:inherit; background:#eee; }
  dl.info > dd { border-left:0; border-width:0; padding:4px 0; float:none; }
  dl.info > dt:first-child { border-top:none;}
  dl.info > dt:first-child + dd { border-top:none; }

  .entry dl:not([class]) > dt { background-color:#afadab; }
  .note { font-size:9px; }

  .container { padding:24px 16px 32px; }
}
@media only screen and ( max-width:380px ){ 
  h1 { font-size:1.3em; }
  
}



/* ::::::::::: FOOTER ::::::::::: */
#site-footer { clear:both; border-color:#aaa; color:#999; position:relative; overflow:visible; background:#333; z-index:3; }
#site-footer .container { padding-top:40px; padding-bottom:40px; }
#breadcrumb { display:none; position:relative; bottom:-40px; font-size:12px; clear:both; z-index:2; } 
ul.breadcrumb a { position:relative; border-bottom-width:6px; border-bottom-style:solid; border-color:#aaa; padding-bottom:4px; display:block; }
ul.breadcrumb a::before, ul.breadcrumb a::after { content:' '; background:#00a39e; display:block; height:8px; width:auto; position:absolute; bottom:-8px; left:0; width:0; z-index:1; transition:all 0.25s ease-in-out 0s; }
ul.breadcrumb a.hover::before { width:100%; }

#footer-company { font-size:.9em; padding:0; text-align:center; }
#footer-logo { margin:0 auto 8px; display:block; padding:0; vertical-align:middle; width:240px; }
#footer-logo img { display:block; }
#footer-logo a { color:inherit; }
#footer-company .company { position:relative; }
#footer-company .company address { font-style:normal; display:block; font-size:12px; line-height:1.3em; }
#footer-company .company address span { display:inline-block; }
#footer-company .company .tel_number { font-size:18px; line-height:1.5em; }
#footer-company .company .tel_number .phone { font-size:1.15em; font-weight:normal; color:inherit; }
#footer-company .company .tel_number .phone::before { content:'TEL.'; font-size:13px; text-transform:uppercase; color:inherit; display:inline-block; margin-right:.4em; }

.page-sitemap { display:block; border-top:1px solid #222; text-align:center; margin-top:1em; }
.page-sitemap li { display:inline-block; padding:0; }
.page-sitemap li a { padding:8px; min-width:120px; display:block; font-size:.9em; }
.page-sitemap li a strong { display:block; font-weight:normal; }
.page-sitemap li a .en { display:block; font-size:.75em; text-transform:uppercase; }


#copyright { clear:both; font-size:10px; padding:16px; text-align:center; background-color:#111; color:#ccc; position:relative; z-index:3; }
#copyright a { color:inherit; }
#copyright span { display:inline-block; padding:0 0 0 7px; }

@media only screen and ( max-width:934px ){ 
  #footer-news { float:none; width:auto; display:block;  }
  #footer-company { float:none; width:auto; display:block; text-align:center; }
  #footer-company .company { float:none; margin:0 auto 16px; }
  #footer-banners::before { content:''; display:block; width:300px; max-width:100%; margin:0 auto 16px; border-top:1px solid #fff; }
  #footer-banners { float:none; }
  #site-footer .container { padding-top:32px; padding-bottom:32px; }
}
@media only screen and ( max-width:782px ){ 
  #site-footer .container { padding-top:24px; padding-bottom:24px; }
}



/* ::::::::::: FRONT PAGE CONTENTS ::::::::::: */

/*#latest-news::before { content:'LATEST NEWS'; display:block; font-size:10px; }
#latest-news { text-align:left; color:#fff; position:absolute; z-index:31; padding:3px 7px 4px; right:0; bottom:0; margin:12px; background-color:#222; background-color:rgba(0,0,0,0.6); border-radius:2px; }
#latest-news a { display:block; color:inherit; padding:0; }
#latest-news a strong { font-size:1.1em; display:inline-block; font-weight:normal; }
#latest-news a .news { font-size:10px; text-transform:uppercase; color:#fff; display:inline-block; margin:-.1em .5em 0 0; line-height:1em; border:1px solid rgba(255,255,255,.5); padding:.2em .4em; }
#latest-news a .date { font-size:.8em; display:inline-block; margin-right:7px; }
#latest-news a.hover { color:#0084c1; }*/

#home-grids { padding:0; margin:0; display:block; overflow:hidden; position:relative; z-index:2; } 
#home-grids::after { content:''; display:block; clear:both; } 
.grid-stage { padding:0; margin:0; width:100%; display:table; table-layout:auto; border-collapse: collapse; position:relative; overflow:visible; height:300px; background-color:transparent; }
.grid { height:100%; padding:0; margin:0; display:table-cell; border-width:0;  vertical-align:middle; text-align:center; background-color:inherit; letter-spacing:0; }
.grid-stage .grid:last-child { width:auto; }
.grid .wrap { padding:0; margin:0; height:100%; display:block; overflow:hidden; background-position:center;/* background-color:rgba(80,190,255,.2);*/ background-color:transparent; background-size:cover; background-repeat:no-repeat; }
.grid .wrap::after { content:''; display:block; clear:both; }
.grid .wrap .text { font-size:.92em; margin-top:.5em; }
.grid .wrap h2 { font-size:1.2em; color:#999; margin: 0; }

.grid .wrap .icon { max-width:120px; max-height:120px; width:auto; height:auto; }
.grid .grid-menu-wrap { background-color:#fff; display:table; width:100%; height:100%; }
.grid .wrap .grid-menu { color:inherit; display:table-cell; width:100%; height:100%; vertical-align:middle; text-align:center;}
.grid .wrap a.grid-menu.hover, .grid .wrap a.grid-menu:hover { color:inherit; opacity:.7; }
.grid a.wrap.hover { color:inherit; }
.g-1 { height:400px; }
.g-2, .g-3, .g-5 { height:360px; }
.g-6 { height:270px; }
.g-1-1 { display:none; }
.g-1-2 { width:60%; background-color:#9AB; }
.g-1-2 .wrap { display:inline-block; padding:24px; font-size:1.1em; line-height:1.8em; height:auto; background-color:transparent; border-width:0;  }
.g-1-3 { width:40%; }
.g-1-1 .wrap, .g-1-3 .wrap { background-image:url('images/grid/g-1-3.jpg'); }
.g-2-1, .g-3-1 { width:40%; }
.g-2-1 .wrap { background-image:url('images/grid/g-2-1.jpg'); }
.g-2-2, .g-3-2 { width:30%; }
.g-2-2 .wrap { background-image:url('images/grid/g-2-2.jpg'); }
.g-2-3, .g-3-3 { width:30%; }
.g-3-1 .wrap { background-image:url('images/grid/g-3-1.jpg'); }
.g-3-3 .wrap { background-image:url('images/grid/g-3-3.jpg'); }
.g-4-1 .wrap { background-image:url('images/grid/g-4-1.jpg'); }
.g-4-2 .wrap { background-image:url('images/grid/g-4-2.jpg'); }
.g-4-3 .wrap { background-image:url('images/grid/g-4-3.jpg'); }
.g-4-4 .wrap { background-image:url('images/grid/g-4-4.jpg'); }

.g-4-1, .g-5-1, .g-6-1 { width:30%; }
.g-4-2, .g-5-2, .g-6-2 { width:20%; }
.g-4-3, .g-5-3, .g-6-3 { width:20%; }
.g-4-4, .g-5-4, .g-6-4 { width:30%; }
.g-5-2, .g-7-3  { vertical-align:top; position:relative; z-index:3; }
.g-6-1 .wrap { background-image:url('images/grid/g-6-1.jpg'); }
.g-5-2 .wrap { background-image:url('images/grid/g-5-2.jpg'); height:175%; margin-bottom:-75%; }
.g-6-3 .wrap { background-image:url('images/grid/g-6-3.jpg'); }
.g-6-4 .wrap { background-image:url('images/grid/g-6-4.jpg'); }
.g-7-1 .wrap { background-image:url('images/grid/g-7-1.jpg'); }
.g-7-2 .wrap { background-image:url('images/grid/g-7-2.jpg'); }
.g-7-1, .g-8-1, .g-9-1 { width:22%; }
.g-7-2, .g-8-2, .g-9-2 { width:18%; }
.g-7-3, .g-8-3 { width:42%; }
.g-7-4, .g-8-4 { width:18%; }
.g-9-3 { width:30%; }
.g-9-4 { width:30%; }
.g-7-4 .wrap { background-image:url('images/grid/g-7-4.jpg'); }
.g-7-3 .wrap { background-color:#fff; height:200%; margin-bottom:-100%; }
.g-8-4 .wrap { background-image:url('images/grid/g-8-4.jpg'); }
.g-9-3 .wrap { background-image:url('images/grid/g-9-3.jpg'); }
.g-9-4 .wrap { background-image:url('images/grid/g-9-4.jpg'); }

.g-7-3 .grid-menu { display:block; position:relative; vertical-align:bottom; }
/*.g-7-3 .grid-menu::after { display:block; content:''; height:360px; background:red; }*/

#facebook { display:block; height:340px; padding:0; margin:16px 16px 0;}
#facebook blockquote { padding:20px; text-align:center; }
#facebook blockquote a { color:#bbb; font-weight:bold; }
#facebook .fb-wrap { width:100%; height:100%; background:#eee; max-width:500px; margin: 0 auto;}
#facebook::after { content:' '; clear:both; display:inline-block; }

@media only screen and ( max-width:782px ){ 

.g-1-2, .g-1-3, .g-2-2, .g-2-3, .g-3-2, .g-3-3,
.g-4-2, .g-4-3, .g-5-1, .g-5-4, .g-6-1, .g-6-4, 
.g-7-2, .g-7-3, .g-8-1, .g-8-3, .g-9-3, .g-9-4 { width:50%; }
.g-2-1, .g-3-1,
.g-4-1, .g-4-4, .g-5-2, .g-5-3, .g-6-2, .g-6-3, 
.g-7-1, .g-7-4, .g-8-2, .g-8-4, .g-9-1, .g-9-2 { display:none; }

.g-1-2 .wrap  { text-align:left; }
.g-1-2 .wrap br { display:none; }
}

@media only screen and ( max-width:480px ){ 

.grid-stage { display:block; position:relative; overflow:visible; height:auto; }
.g-1, .g-2, .g-3, .g-4, .g-5, .g-6, .g-7, .g-8, .g-9 { height:auto; width:auto;  }
.grid { height:auto; display:block; }
.grid-stage::after { content:''; display:block; clear:both;  }
.g-1-2 .wrap { padding-top:40px; padding-bottom:40px; }
.grid .wrap::before { content:''; display:block; padding:240px 0 0 0; }
.grid .grid-menu-wrap { display:block; padding:16px;  }
.grid .grid-menu-wrap::before, .g-1-2 .wrap::before { display:none; }
.grid .wrap .grid-menu { display:block; }
.grid a.wrap.hover { color:inherit; }

.g-3-1 .wrap { background-image:url('images/grid/g-3-3.jpg'); }
.g-1-1, .g-1-2, .g-2-2, .g-2-3, .g-3-1, .g-3-2, .g-5-1, .g-6-1, .g-7-3 { display:block; width:100%; }
.g-1-3, .g-2-1, .g-3-3, .g-4-3, .g-4-4, .g-5-2, .g-5-3, .g-5-4, .g-6-2, .g-6-3, .g-6-4, .g-7-4, .g-8-1, .g-8-2, .g-8-3, .g-8-4, .g-9-1, .g-9-2 { display:none; }
.g-4-1, .g-4-2, .g-7-1, .g-7-2, .g-9-3, .g-9-4 { display:block; width:50%; float:left; }
.g-9-4 { float:none; }
.g-7-3 .wrap { height:auto; margin-bottom:0; }/*facebook*/

}


section a.banner { display:block; margin:32px 0; }
section a.banner img { max-width:100%; height:auto; }
#section-end { padding-top:0; overflow:visible; }
.button.contact { position:relative; display:block; width:720px; margin:0 auto; text-align:center; overflow:visible; }
.button .fukidashi { position:relative; display:inline-block; width:60px; height:60px; background:#fff; text-align:center; font-weight:bold; color:#3b3b3b; padding:20px 0; font-size:16px; line-height:20px; vertical-align:middle; border-radius:30px;  margin:-36px 24px -12px 0; overflow:visible; }
.button .fukidashi::after{ border-width:6px 20px; border-style:solid; border-color:transparent; border-left-color:#fff; content:''; height:0; width:0; display:block; position:absolute; margin-top:0; margin-left:-4px; left:100%; top:50%; -webkit-transform:rotate(12deg); transform:rotate(12deg); }

#page-header { padding:0; min-height:120px; position:relative; vertical-align:middle; background-color:#eee; }
#page-header .headlines { position:absolute; left:24px; bottom:24px; z-index:2; }
#page-header .headlines h1 { margin-top:0.3em; }
.header-image { display:block; opacity:1; margin:0 auto; padding:0; height:auto; width:100%; z-index:2; display:block; overflow:hidden; background-position:center center; background-size:cover; }
.header-image img { position:absolute; top:0; right:0; bottom:0; left:0; opacity:0; }
.header-image::before { content:''; display:block; padding:25% 0 0; }
.header-image.sp { display:none; opacity:0; z-index:-1; }
.header-image.sp::before { padding:100% 0 0; }
.header-image.no-image::before { padding:56px 0 0 0; }
h2.headline { margin-top:0; margin-bottom:16px; }
h2.headline span.title { display:block; }
h2.headline span.subtitle { display:block; font-size:.7em; text-transform:capitalize; }
.columns { align-items:center; margin:0; }
.columns + .columns { margin-top:3.5em; }
.column + .map-column { margin-top:24px; }
.map-canvas { border-width:1px }
.map-link { font-size:12px; float:right; display:block; padding:.2em; }
.map-link::before { content:''; }
.image-column { background-size:cover; background-position:center center; }

#section-mission .columns { position:relative; padding-top:1.2em; }
#section-mission { counter-reset:columns; }
#section-mission .columns .info-column::before { content:counter(columns, decimal-leading-zero); counter-increment:columns; display:block; margin:0 0 .1em; font-size:4em; font-weight:100; line-height:1em; padding:0; }
#section-mission .columns .image-column { margin:0; min-height:240px; }
#section-mission .columns:nth-child(2n) .info-column { width:60%; }
#section-mission .columns:nth-child(2n) .image-column { width:35%; }
#section-mission .columns:nth-child(2n+1) { -webkit-flex-direction:row-reverse; flex-direction:row-reverse; }
#section-mission .columns:nth-child(2n+1) .info-column { width:60%; }
#section-mission .columns:nth-child(2n+1) .image-column { width:35%; }


#section-profile { position:relative; }
#section-profile h2.headline { position:absolute; left:0; top:0; bottom:0; margin:0; width:120px; border-right-width:4px; padding-right:8px; }
#section-profile .columns { display:block; position:static; padding:0; }
#section-profile .columns .info-column { width:60%; float:left; position:relative; padding-left:136px; }
#section-profile .columns .info-column .entry { margin:0; padding:0; }
#section-profile .columns:first-child .image-column { float:none; width:35%; position:absolute; top:0; bottom:0; margin:auto; height:auto; max-height:480px; background-position:center top; }
#section-profile .columns::after { display:block; content:''; clear:both; padding:0; height:2px; margin:0; }
#section-profile .columns:first-child + .columns .image-column { display:none; }

#section-flow { counter-reset:columns; }
#section-flow .columns { position:relative; padding-left:9em; }
#section-flow .columns::before { content:counter(columns, decimal-leading-zero); counter-increment:columns; display:block; position:absolute; top:0; left:-.1em; margin:0; font-size:4em; line-height:1em; padding:0; }

#section-access .columns { -webkit-flex-direction:column-reverse; flex-direction:column-reverse; }
#section-access .columns .info-column { display:block; padding-top:24px; }
#section-access .columns .image-column { display:block; width:100%; height:380px; margin-bottom:24px; }

#section-faq dl.faq { display:block; }
#section-faq dl.faq dt { display:block; font-weight:normal; font-size:1.5em; line-height:1.3em; position:relative; padding:0; margin:40px 0 0 0; }
#section-faq dl.faq dt:first-child { margin:0; }
/*#section-faq dl.faq dt::before { content:'Q'; font-size:56px; position:absolute; left:0; color:gray; }*/
#section-faq dl.faq dd { display:block; position:relative; padding:0 0 0 80px; min-height:64px; margin:8px 0 0 0; }
#section-faq dl.faq > dd > p:first-child { margin-top:0; padding-top:0; }
#section-faq dl.faq dd::after { content:'A'; display:block; font-size:54px; vertical-align:middle; text-align:center; line-height:64px; height:64px; width:64px; position:absolute; left:0; top:0; color:#ccc; border-width:1px; }
#section-faq dl.faq + a.button, #section-faq dl.faq + p { margin-top:32px; }



/* ::::::::::: ITEMSLIST SECTION (CATEGORY PAGE) ::::::::::: */
#section-service .container { max-width:1480px; }
.work-list { padding:0; } /* important margin-top ** disable padding */
.work-list .work { display:block; padding:0; margin:0; overflow:visible; font-size:.95em; vertical-align:top; }
.work-list .work + .work { margin-top:56px; }
.work-list .work .wrap { display:block; margin:0; padding:0; text-align:left; overflow:visible; position:relative; display:-ms-flexbox; display:-webkit-flex; display:flex; justify-content:center; align-items:center;  -webkit-flex-direction:row-reverse; flex-direction:row-reverse; }
.work-list .work .image { width:60%; margin-right:-30%; float:right; text-align:left; display:block; text-align:right; height:auto; padding:0; margin:0; overflow:visible; position:relative; z-index:1; background:#fff; transition:opacity 0.25s ease 0s; }
.work-list .work .image > img { max-width:130%; height:auto; margin:0 -30% 0 0; display:block; }
.work-list .work .url { padding:12px 32px; margin:8px auto; line-height:1em; text-transform:uppercase; font-size:14px; font-weight:normal; display:inline-block; }
.work-list .work .url i::before { margin:0 .4em 0 -.2em; }
.work-list .work .info { width:70%; padding-right:32px; position:relative; z-index:2; }
.work-list .title { border-bottom-width:1px; padding:0 0 8px; margin:0; }
.work-list .title span { margin:0 0 8px; }
.work-list .summary { margin-top:16px; font-size:.9em;}
.work-list .feature { margin-top:16px; font-size:.9em; background:#f7f7f7; padding:8px; }
.work-list .feature > ul { margin:0; }
.work-list .feature > ul li::before { background:#aaa; }
/*.work-list .title { color:inherit; text-transform:uppercase; display:inline-block; min-width:8em; padding:8px 0 16px 0; margin:16px 0 0 0; position:relative; border-width:0; }*/
/*.work-list .title::after { content:''; height:6px; width:100%; background:#414444; display:block; position:absolute; left:0; bottom:0; border-width:0; }*/
.work-list .logo { max-width:320px; margin:0 0 8px; }
.noresult, .noresult p { display:block; text-align:center; }
.noresult a.button { margin:24px auto 0; }


@media only screen and ( max-width:934px ){ 
  .header-image::before { padding:40% 0 0; background:}
}
@media only screen and ( max-width:782px ){ 
  #latest-news { left:0; right:0; bottom:0; margin:0; font-size:.9em; }
  #section-mission .image-column img { width:100%; height:100%; position:absolute; opacity:0; }
  #section-mission .image-column { position:relative; display:block; overflow:hidden; background-size:cover; }
  #section-mission .image-column::before { content:''; display:block; padding:50% 0 0;}
  .work-list .work + .work { margin-top:40px; }
  .work-list .work .wrap { position:relative; padding-bottom:40px; }
  .work-list .work .image { position:static; padding-bottom:16px; float:none; }
  .work-list .work .url { }
  .work-list .work .wrap { display:block; }
  .work-list .work .image > img { max-width:100%; margin-right:0%; float:none; }
  .work-list .work .image { display:block; width:auto; margin:0; padding:0; float:none; }
  .work-list .work .info { display:block; width:auto; margin:16px 0; padding:0; float:none; }
  .work-list .logo { display:block; padding:0; }
  .work-list .title { text-align:center; }
}
@media only screen and ( max-width : 600px ){ 
  #section-flow .columns { position:relative; padding-left:0; }
  #section-flow .headline {padding-left:3.6em;}
  #section-flow .columns::before { left:0; margin:0; font-size:3.5em; line-height:1.2em; padding:0; }
  .header-image.sp { display:block; opacity:1; }
  .header-image.sp + .header-image { display:none; }

  #section-profile h2.headline { position:static; width:auto; border-width:0 0 1px 4px; padding:0 0 0 8px; margin-bottom:8px; }
  #section-profile .columns .info-column { width:auto; padding:0; }
  .work-list .work .image > img { max-width:115%; margin-right:-15%; }
}
@media only screen and ( max-width:480px ){ 
  #page-header .headlines { left:16px; bottom:16px; }
  #section-faq dl.faq dd br { display:none; }
  .work-list .work .image > img { max-width:130%; margin-right:-30%; }
}




/* ::::::::::: BLOG LIST ::::::::::: */

ul.post-list { padding:40px 0 24px; margin:0 -16px; }
ul.post-list::after { clear:both; display:block; content:' '; overflow:hidden; visibility:hidden; }
ul.post-list li { line-height:20px; display:block; width:50%; float:left; margin:0; padding:16px; position:relative; }
ul.post-list li a { display:block; display:table; padding:0; width:100%; } 
ul.post-list li a > div { display:inline-block; vertical-align:middle; text-align:left; }
ul.post-list li .image { height:120px; width:120px; background:#eee; border-width:1px; position:relative; overflow:hidden; }
ul.post-list li .image::before { content:'\e80d'; line-height:1em; font-size:100px; width:1em; height:1em; text-align:center; display:block; font-family:'fontello'; color:#fff; position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; }
ul.post-list li .image img { height:100%; width:100%; position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; display:block; }
/*ul.post-list li a:hover .image img { transform:scale(1.3) rotate(15deg); -webkit-transform:scale(1.3) rotate(15deg); -ms-transform:scale(1.3) rotate(15deg); transition:0.3s ease-out; }*/
ul.post-list li .text { padding:0 0 0 15px; }
ul.post-list li .date { display:inline-block; font-size:.85em; line-height:1.2em; letter-spacing:.2em; border-width:1px; padding:4px 8px; }
ul.post-list li .date::after { }
ul.post-list li .title { margin-bottom:5px; font-weight:normal; display:block; font-size:1.em; line-height:1.3em; }


@media screen and ( max-width:782px ){
  ul.post-list { margin:0; }
  ul.post-list li { width:80%; float:none; margin:0 10%; padding:10px 0; }
}
@media screen and ( max-width:480px ){ 
  ul.post-list li { width:100%; margin:0; padding:10px; }
  ul.post-list li .image { height:100px; width:100px; }
  ul.post-list li strong.title { font-size:1em; }
  ul.post-list li .subitem { height:38px; width:38px; font-size:10px; line-height:12px; } 
}

#post-archive .channel { text-align:center; }
#post-archive .channel > p.counter, #post-archive > .channel > p.navigation { display:inline-block; }
#post-archive .channel > p.counter { font-size:.9em; }





/* ::::::::::: FORMS ::::::::::: */

@media (min-width:1px) { /*only modern browser*/
  input[type="radio"]+label::after, input[type="radio"]+.wpcf7-list-item-label::after { background:#ccc; }
  input[type="radio"]:checked+label::after, input[type="radio"]:checked+.wpcf7-list-item-label::after { background:#0c6184; }
  input[type="checkbox"]:checked+label::after, input[type="checkbox"]:checked+.wpcf7-list-item-label::after { border-color:#0c6184; }
}
.wpcf7 { margin:0; padding:0; }/* contact form 07 */
input, textarea {  }
.privacy-policy { padding-top:16px; text-align:left; }
.privacy-policy h3 { font-size:1em; padding:0; margin:0; }
.privacy-policy ul { margin-top:0; }
.privacy-policy ul li { font-size:.8em; margin:.4em 0; }


/* ::::::::::: SINGLE NEWS PAGE ::::::::::: */

article .entry-head { text-align:center; position:relative; padding-top:32px; padding-bottom:0; }
article .entry-head .date { text-align:inherit; margin-bottom:8px; }
article .entry-head .date .day { display:inline-block; font-size:18px; line-height:24px; }
article .entry-head .date .day::after { content:'日'; display:inline-block; font-size:14px; }
article .entry-head .date .month { margin-left:.3em; }
article .entry-head .date .month, article .entry-head .date .year { display:inline-block; font-size:18px; line-height:24px; }
article .entry-head .date .month::after { content:'月'; display:inline-block; font-size:14px; }
article .entry-head .date .year::after { content:'年'; display:inline-block; font-size:14px; }
article .entry-head h1 { text-align:inherit; } 
article .entry-head::after { content:' '; display:block; clear:both; }
article .entry-head { padding-bottom:30px; border-bottom-width:1px; }
article .entry-head + .entry { padding-top:24px; padding-bottom:16px; }
article .channel { margin-top:24px; padding-bottom:0; padding-top:8px; border-top-width:1px; }
article .channel a { padding:8px 0; }
article .channel strong { font-weight:normal; }
article .channel .single-post-navi a .image-wrap { border-width:1px; background-color:#eee }
article .channel .single-post-navi a .image-wrap::before { opacity:.9; }
/*article .mainimage img { width:100%; height:auto; }
article .mainimage .photo { font-size:10px; text-align:right; }*/
article .work-data { padding:24px 0 0; }
article .work-data h1 { margin:0 0 8px 0; }
article .work-data .place, article .work-data .year { color:#999;}
.post-link { margin:16px 0; }
.post-link a { display:inline-block; min-width:40%; padding-left:16px; padding-right:16px; }



#loading-overlay { display:block; background-color:#fff; position:fixed; top:-100px; left:-100px; right:-100px; bottom:-100px; z-index:901; }
#loading-overlay .loading { opacity:0; /*fadein by js*/ position:absolute; top:50%; left:50%; height:240px; width:180px; margin:-100px; text-align:center; }
body.loading #loading-overlay .loading { opacity:1; }
#loading-overlay .loading .logo { text-align:center; vertical-align:middle; padding-bottom:10px; width:100%; height:100%; display:table-cell; transition:all 1s ease-out; }
#loading-overlay .loading .logo img { height:auto; width:200px; max-width:90%; margin:1em auto; }
#loading-overlay .loading div.progress { position:absolute; left:0; right:0; top:auto; bottom:0; z-index:5; height:1em; font-size:10px; color:#0084c1; letter-spacing:.15em; margin:auto; text-align:center; display:block; }
#loading-overlay .loading div.progress > span { font-size:16px; color:#0084c1; }
#loading-overlay .loading div.progress::after { content:'%'; display:inline-block; }

