    /**
    * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
    * http://cssreset.com
    */
    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, img, ins, kbd, q, s, samp,
    small, strike, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section {
    display: block;
    }
    body {
    line-height: 1;
    }
    ol, ul {
    list-style: none;
    }
    blockquote, q {
    quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
    content: '';
    content: none;
    }
    table {
    border-collapse: collapse;
    border-spacing: 0;
    }
	
	body {color: #666666;font-family:"Arial","中ゴシック BBB","メイリオ","ＭＳ Ｐゴシック" ;font-size:12px;line-height:160%;background-color:#ffffff;}
	.clr{ clear:both;}
	a:hover{ opacity: 0.7;filter: alpha(opacity=70);-moz-opacity: 0.7;}
	a{ text-decoration:none; color:#232323; -webkit-transition: 0.3s ease-in-out;  -moz-transition: 0.3s ease-in-out;  -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
	
	#main{ position: relative; }
	.logo{ float:left;}
	.btn_fb{ text-align:right; float:right; margin-left:10px;}
	.header{ width:100%;background:rgba(255, 255, 255, 0.8); position:fixed; z-index:9999;}
	.head_contents{ padding:20px; margin:0 auto;  overflow:hidden; }
	.head_contentsIn{border-bottom:1px dashed #cccccc;}
	.head_menu_s{ margin:40px 0 0 0; text-align:right;}
	.head_menu_s ul{ display: flex; flex-flow: row wrap; justify-content: flex-end;}
	.head_menu_s ul li{ margin-left:50px; font-size:14px;}
	.main_img{ height:auto; margin:0 auto;width: 100%;}
	.main_img img{object-fit: cover; width:100%; height:84%;}
	.main_img_bk{height: auto; z-index: -1; margin:0 auto;}
	.news{ width:720px; margin:50px auto 0 auto;}
	.news img{ float:left;}
	.news a{ color:#666666;}
	.news a:hover{ color:#666666; text-decoration:none;}
	.news strong{ font-weight:bold;}
	.ticker{ background:#f4f4f4; width:610px; height:32px;text-align:left;position: relative; overflow: hidden;}
    .ticker ul {width: 100%;position: relative; padding:6px 0 0 0; height:32px; margin:0 0 0 0px;}
    .ticker ul li {	width: 100%;display: none; padding:6px 0 0 0; height:32px; margin:0 0 0 10px;}
	.contents{ width:870px; margin:0 auto 0 auto; }
	h1{ margin:0 0 10px 0;}
	.box1{ width:690px; margin:50px auto; overflow:hidden;}
	.box2{ width:870px; margin:100px 0;}
	.box3{ width:870px; margin:50px 0;}
	.fl_l{ float:left;}
	.fl_r{ float:right;}
	.box1 h2,.box2 h2,.box3 h2,.worksArea h2,.contactArea h2{ width:117px; margin:0 auto 50px auto; font-size:28px; color:#232323;line-height: 100%;}
	.worksArea h2{margin-top:30px}
	.box2 ul li.works_fl,.box3 ul li.works_fl{ float:left; width:210px; margin:0 10px 0 0;}
	h3{ margin:30px 0 0 0;}
	h4{ font-weight:bold;}
	ul.worksbox li img{ margin:15px 0 0 0;}
	footer{ width:100%; border-top:#cccccc 1px dashed; padding:20px 1%; box-sizing: border-box;}
	.foot_menu_s{ float:right;}
	.foot_menu_s ul{ display: flex; flex-flow: row wrap; justify-content: flex-end;}
	.foot_menu_s ul li{ margin-left:30px; font-size:14px;}
	.pic_head{ width:870px; padding:20px 0 20px 0; margin:0px 0 0 0; border-top:#666666 1px dashed;}
	.back_list{ width:116px; float:left;}
	.pic_name{ width:637px; text-align:center; float:left;}
	.pic_head img{ vertical-align:-2px;}
	.pic_name h2{ font-size:26px; font-weight:bold;}
	.pager{ float:right; width:117px; text-align:right;}
	.pager .prev{ margin:0 10px 0 0; }
	.itemArea{width:100%; display:flex;-webkit-align-items: center; align-items: center;position:relative;}
	.item{width:60%; text-align:center; padding:5% 0 5% 10%; box-sizing:border-box;}
	.item img{max-width:100%;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px #000000;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px rgba(0, 0, 0, 0.18); max-height: 630px;}
	.item.item2 img{max-width:100%;-webkit-filter: drop-shadow(0 14px 38px rgba(0, 0, 0, 0.5)) ;-moz-filter: drop-shadow(0 14px 38px rgba(0, 0, 0, 0.5)) ;-ms-filter: drop-shadow(0 14px 38px rgba(0, 0, 0, 0.5)) ;filter: drop-shadow(0 14px 38px rgba(0, 0, 0, 0.5)) ;max-height: 630px;box-shadow:none;}
	.miniworksItem .item img{max-width:70%;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px #000000;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px rgba(0, 0, 0, 0.18); max-height: 630px;}
	.txt{ width:40%; text-align:center; padding-right: 60px;}
	.pagerLeft a{position:absolute; top:0; left:0; width:5%; height:100%; display:block; box-sizing:border-box; padding-top:20%; text-align:center; font-size:18px; color:#232323;}
	.pagerLeft a:hover,.pagerRight a:hover{background:rgba(0,0,0,0.1);}
	.pagerLeft a i{position:absolute; top:50%; left:26%;}
	.pagerRight a i{position:absolute; top:50%; right:26%;}
	.pagerLeft a.lastnow{ cursor: inherit;}
	.pagerLeft a.lastnow:hover{background:none;opacity: 1.0;filter: alpha(opacity=100);-moz-opacity: 1.0;}
	.pagerLeft a.lastnow i{opacity: 0.3;filter: alpha(opacity=30);-moz-opacity: 0.3;}
	.pagerLeft a.lastnow:hover i{}
	.pagerRight a{display:block; position:absolute; width:5%; height:100%; top:0; right:0; box-sizing:border-box; padding-top:20%; text-align:center; font-size:18px; color:#232323;}
	.worksYears ul{display:flex; flex-flow: row wrap; -webkit-justify-content: flex-start; justify-content: flex-start; border-top:1px dashed #cccccc;}
	.worksYears ul li{ text-align:center; border-right:1px dashed #cccccc; /*width:12.5%;*/ -webkit-flex-grow: 1; flex-grow: 1;}
	.worksYears ul li a{display:block;  padding:10px 0; width:100%;}
	.worksYears ul li a:hover{background:rgba(0,0,0,0.1);}
	.worksYears ul li:last-child{border-right:none;}
	/*.worksbox{ overflow:hidden;}*/
	.worksArea{ width:970px; margin:50px auto;}
	.worksArea ul{display: flex;flex-flow: row wrap; margin-bottom: 50px;}
	.worksArea ul li{ width: calc(50% - 6%); height: 375px;}
	.worksArea ul li:nth-child(odd){margin-right: 8%; margin-left:2%;}
	.miniworksArea{ width:970px; margin:50px auto;}
	.miniworksArea ul{display: flex;flex-flow: row wrap;}
	.miniworksArea ul li{width: calc(20% - 3%); margin: 0 3% 3% 0; height: 164px;}
	.miniworksArea ul li:nth-child(5n){margin-right: 0;}
	/*.worksArea ul li:first-child{ margin-left:1%}*/
	.worksArea ul li img{object-fit: cover; width:100%; height:100%;}
	.worksArea h3{font-size:32px; color:#232323; margin:30px 0 0 2%; text-align:left;}
	.miniworksArea ul li img{object-fit: cover;width: 100%;height: 100%;}
	.miniworksArea h3{font-size:14px; color:#232323; margin:30px 0 50px; text-align:center;}
	.box1 h3{ color:#232323; margin-bottom:10px;}
	.box1 h3 span{font-size:26px; display:block; margin-bottom:5px;}
	.contactArea{width:690px; margin:50px auto 0 auto;}
	
	.worksListArea{max-width:970px; margin:0 auto; padding:50px 0;}
	.worksListArea h2{margin:0 0 50px; font-size:28px; color:#232323;line-height: 1; text-align:center;}
	.miniworksArea h2{margin:0 0 50px; font-size:28px; color:#232323;line-height: 1; text-align:center;}
	.worksListArea ul{ max-width:970px; display:flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
	.worksListArea ul li{width:calc(25% - 2%); margin-right:2%; margin-bottom: 1.2%;}
	.worksListArea ul li:nth-child(4n){margin-right:0;}
	.worksListArea ul li img{object-fit: cover; width:100%; height:160px;}
	
	/*/////////////////////////////////////////
	NEWSページ
	/////////////////////////////////////////*/
	.news_nbox{ height:100px;}
	.news_contents{ width:870px; margin:0px auto 0 auto;/* padding-top:100px;*/}
	.news_box{ padding:0  30px 80px 30px; border-bottom:dashed #cccccc 1px;}
	.news_box h3{ font-size:14px; font-weight:bold;}
	.news_box span{ color:#9b0101;}
	.news_box a{ color:#666666;}
	.news_box a:hover{ color:#666666; text-decoration:none;}
	
	/*/////////////////////////////////////////
	PROFILE
	/////////////////////////////////////////*/
	
	.profileT h3{ margin:20px 0 0 0;}
	.profileT{float:left;}
	.profileI{float:right;}
	
	/*/////////////////////////////////////////
	マージン
	/////////////////////////////////////////*/
	.mt10{ margin-top:10px;}
	.mt20{ margin-top:20px;}
	.mb10{ margin-bottom:10px;}
	
	/*/////////////////////////////////////////
	パディング
	/////////////////////////////////////////*/
	.pt20{ padding-top:20px;}
	.pt40{ padding-top:40px;}
	
	/*/////////////////////////////////////////
	追加
	/////////////////////////////////////////*/
	.moreBox{ margin:-20px 2% 0 0;; text-align:right; }
	.moreBox a{ color:#232323; font-size:20px;}
	.moreBox a:hover{ text-decoration:none;}
	
	/*/////////////////////////////////////////
	トップ：お知らせ文
	/////////////////////////////////////////*/
.topContentsBox .top_news {
    margin:3%;
    border-radius: 8px 8px;
    background-color: rgba(0, 0, 0, 0.50);
    border: 1px solid rgba(0, 0, 0, 0.60);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    color: aliceblue;
}
.topContentsBox .col_left {
    padding: 1%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.60);
    text-align: center;
}
.topContentsBox .col_right {
    padding: 1.5%;
    text-align: left;
}
	
	/*/////////////////////////////////////////
	スライダー
	/////////////////////////////////////////*/
	.flexslider .fixedmsg h3 strong {
	color: rgb(157, 206, 0); font-size: 1.3em;
}
.flexslider .fixedmsg h3 {
	background: rgba(0, 0, 0, 0.4); padding: 20px 0px; top: 55%; width: 100%; text-align: center; color: rgb(255, 255, 255) !important; text-transform: uppercase; font-size: 1.3em; position: absolute; z-index: 999999999; text-shadow: 1px 1px 0px #000;
}
.flexslider .fixedmsg h3 span {
	font-size: 0.6em !important;
}
.flex-container a:active {
	
}
.flexslider a:active {
	
}
.slides {
	list-style: none; margin: 0px; padding: 0px;
}

.flexslider {
	margin: 0px; padding: 0px; width: 100%;
}
.flexslider .slides > li {
	display: none;
}
.flexslider .slides img {
	margin-bottom: 0px; display: block; max-width: 100%;
}
.flexslider .slides iframe {
	width: 100%; margin-bottom: 0px; display: block;
}

.slides::after {
	height: 0px; line-height: 0; clear: both; display: block; visibility: hidden; content: ".";
}
html[xmlns] .slides {
	display: block;
}
* html .slides {
	height: 1%;
}
.no-js .slides > li:first-child {
	display: block;
}
.flexslider {
	position: relative; -ms-zoom: 1;
}
.flexslider .slides {
	-ms-zoom: 1;
}
.flexslider .slides > li {
	margin: 0px; overflow: hidden; position: relative;
}
.flex-container {
	position: relative; -ms-zoom: 1;
}
.flex-direction-nav {
	height: 0px;
}
.flex-direction-nav li a {
	margin: 0px; top: -57px; width: 25px; height: 25px; display: block; position: absolute; cursor: pointer;
}
.flex-direction-nav li .flex-next {
	background: url("images/icons/nav_right.png") no-repeat -3px -3px; right: 52px; text-indent: -9999em;
}
.flex-direction-nav li .flex-prev {
	background: url("images/icons/nav_left.png") no-repeat -3px -3px; right: 72px; text-indent: -9999em;
}
.flex-control-nav {
	left: 50%; top: 80%; width: 100px; margin-left: -50px; position: absolute; z-index: 1;
}
.flex-control-nav li {
	margin: 0px 0px 0px 5px; display: inline-block; -ms-zoom: 1;
}
.flex-control-nav li:first-child {
	margin: 0px;
}
.flex-control-nav li a {
	background: url("images/icons/bullets.png") no-repeat 0px 0px; width: 16px; height: 20px; text-indent: -9999px; display: block; cursor: pointer; opacity: 0.8;
}
.flex-control-nav li a:hover {
	opacity: 0.7;
}
.flex-control-nav li a.flex-active {
	background-position: 0px -18px; cursor: default; opacity: 0.9;
}
.flexfull_recruit {
	height: auto !important;
}
.flexfull_r {
	margin: 70px 0px 0px; width: 100%; height: auto !important; position: relative !important;
}
.flexfull_wrap {
	width: 100%; height: 680px !important;
}
.flexfull {
	margin: 0px; left: 0px; top: 141px; height: 680px !important; overflow: hidden; position: fixed;
}
.flexfull .flex-control-nav {
	display: none;
}
.flexfull .flex-direction-nav {
	display: none;
}
.flexfull .flex-direction-nav li a {
	margin: 0px; top: 42%; width: 46px; height: 53px; display: block; position: absolute; z-index: 1; cursor: pointer;
}
.flexfull .flex-direction-nav li .flex-next {
	background: url("images/icons/bg_arrows.png") no-repeat -45px 0px; right: 0px; text-indent: -9999em;
}
.flexfull .flex-direction-nav li .flex-prev {
	background: url("images/icons/bg_arrows.png") no-repeat 0px 0px; left: 0px; text-indent: -9999em;
}
.flexfull .flex-control-nav li a {
	background: url("images/icons/bullets-inv.png");
}
.flexfull .flex-control-nav li a.flex-active {
	background-position: 0px -18px;
}
.flexfull .inside {
	padding: 0px !important; left: 0px; top: 0px; width: 100%; overflow: hidden; position: absolute; z-index: 1;
}
.stuff {
	margin: 0px auto; width: 960px; height: auto; overflow: hidden;
}
.stuff h1 {
	padding: 30px 0px; text-align: center; font-weight: 800;
}
.stuff2 {
	margin: 0px auto; width: 95%; height: auto; overflow: hidden; max-width: 960px;
}
.stuff2 h1 {
	margin: 160px auto 40px; padding: 40px 0px 0px; width: 160px; text-align: center; font-family: "Source Sans Pro", sans-serif; font-size: 26px; font-weight: 300;
}
.stuff2 h1 span {
	color: rgb(157, 206, 0); font-weight: 600;
}
.stuff2 p {
	text-align: center; text-transform: uppercase; line-height: 1.6; font-size:27px; font-weight: 300; word-spacing: 4px; font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}
.stuff2 h1 {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 h1 a {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 h1 a:hover {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 p {
	color: #ffffff !important; 
}
.stuff-intro {
	left: 50%; width: 720px; height: auto; overflow: hidden; margin-left: -360px; position: absolute; z-index: 999;
}
.stuff-intro h1 {
	padding: 25px 0px 20px; text-align: center; text-transform: uppercase; line-height: 0.9; font-family: "AvenirLTStd95Black", Arial, sans-serif !important; font-size: 60pt; font-weight: 900; margin-top: 190px; border-top-color: rgb(255, 255, 255); border-bottom-color: rgb(255, 255, 255); border-top-width: 2px; border-bottom-width: 2px; border-top-style: solid; border-bottom-style: solid;
}
.stuff-intro p {
	text-align: center; color: rgb(255, 255, 255); line-height: 1.3; font-size: 16pt; font-weight: bold;
}
.stuff-intro h1 {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 h1 a {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 h1 a:hover {
	color: rgb(255, 255, 255) !important; text-shadow: 1px 1px 0px #000;
}
.stuff2 p {
	color: #ffffff !important;
}
.slider_full {
	width: 100%;
}
.slider_full::after {
	background: url("images/bg/pattern.png"); left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 0; content: ""; box-shadow: inset 0px 0px 100px rgba(0,0,0,0.8); -moz-box-shadow: 0px 0px 100px rgba(0, 0, 0, .8) inset; -webkit-box-shadow: 0px 0px 100px rgba(0, 0, 0, .8) inset;
}
.slider_full img {
	width: 100%;
}

.pcnone{display:none;}
.spnone{display:inherit;}

/*! Lity - v2.3.1 - 2018-04-20
* http://sorgalla.com/lity/
* Copyright (c) 2015-2018 Jan Sorgalla; Licensed MIT */
.lity {
  z-index: 9990;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  white-space: nowrap;
  background: #0b0b0b;
  background: rgba(0, 0, 0, 0.9);
  outline: none !important;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.lity.lity-opened {
  opacity: 1;
}
.lity.lity-closed {
  opacity: 0;
}
.lity * {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.lity-wrap {
  z-index: 9990;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  outline: none !important;
}
.lity-wrap:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
.lity-loader {
  z-index: 9991;
  color: #fff;
  position: absolute;
  top: 50%;
  margin-top: -0.8em;
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.lity-loading .lity-loader {
  opacity: 1;
}
.lity-container {
  z-index: 9992;
  position: relative;
  text-align: left;
  vertical-align: middle;
  display: inline-block;
  white-space: normal;
  max-width: 100%;
  max-height: 100%;
  outline: none !important;
}
.lity-content {
  z-index: 9993;
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
       -o-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  -o-transition: -o-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease, -o-transform 0.3s ease;
  padding:2%;
}
.lity-loading .lity-content,
.lity-closed .lity-content {
  -webkit-transform: scale(0.8);
      -ms-transform: scale(0.8);
       -o-transform: scale(0.8);
          transform: scale(0.8);
}
.lity-content:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.lity-close {
  z-index: 9994;
  width: 35px;
  height: 35px;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-appearance: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  padding: 0;
  color: #fff;
  font-style: normal;
  font-size: 35px;
  font-family: Arial, Baskerville, monospace;
  line-height: 35px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  border: 0;
  background: none;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.lity-close::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.lity-close:hover,
.lity-close:focus,
.lity-close:active,
.lity-close:visited {
  text-decoration: none;
  text-align: center;
  padding: 0;
  color: #fff;
  font-style: normal;
  font-size: 35px;
  font-family: Arial, Baskerville, monospace;
  line-height: 35px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  border: 0;
  background: none;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.lity-close:active {
  top: 1px;
}
/* Image */
.lity-image img {
  max-width: 100%;
  display: block;
  line-height: 0;
  border: 0;
}
/* iFrame */
.lity-iframe .lity-container,
.lity-youtube .lity-container,
.lity-vimeo .lity-container,
.lity-facebookvideo .lity-container,
.lity-googlemaps .lity-container {
  width: 100%;
  max-width: 964px;
}
.lity-iframe-container {
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  overflow: auto;
  pointer-events: auto;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-overflow-scrolling: touch;
}
.lity-iframe-container iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}
.lity-hide {
  display: none;
}

.topContents h1 img{width:80%;} 

@media only screen and (max-width: 479px) {
	.pcnone{display:inherit;}
    .spnone{display:none;}
	.head_contents{padding-left:4%;}
	.logo{ width:40%;}
	.main_img{ height:280px; margin-bottom:0;}
	.main_img img{height:100%;}
	.worksArea ul li img{height:96%;}
	.worksArea{padding:0 2%; width:100%;}
	.miniworksArea{padding:0 2%; width:100%;}
 	.worksArea ul li{width: calc(50% - 6%); margin-right:2%; height: 150px;}
	.worksArea ul li:nth-child(even){ margin-right:0;}
	.miniworksArea ul li{width: calc(50% - 6%); margin-right:2%; height: 150px;}
	.miniworksArea ul li:nth-child(even){ margin-right:0;}
	/*.worksArea ul li:first-child{ margin-left:0;}*/
	.worksArea ul li:nth-child(2n+1) {margin-right: 4%;margin-left: 4%;}
	.worksArea h3{font-size:24px; margin-left: 4%;}
	.miniworksArea ul li:nth-child(2n+1) {margin-right: 4%;margin-left: 4%;}
	.miniworksArea h3{font-size:18px; margin-left: 4%;}
	ul.worksbox li img{margin-top:10px;}
	.moreBox{ margin:14px 1% 0 0;}
	.moreBox a{  font-size:20px; margin-right:2%;}
	.box1{padding:0 2%; width:100%;}
	.profileT{float:none;}
	.profileI{float:none; margin-bottom:30px;width:100%;}
	.contactArea{width:100%; padding:0 2%;}
	.itemArea{display:block;}
	.item{width:100%; padding:5%;}
	.item img{width:80%;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px #000000;box-shadow: 0 14px 38px rgba(0, 0, 0, 0.18), 0 0 80px 15px rgba(0, 0, 0, 0.18); max-height:100%;}
	.item img[title="夜の出来事"]{width:40%;}
	.item img[src="images/golden-typhoon.jpg"]{width:65%;}
	.txt{ width:100%; text-align:center; padding-bottom:20px; padding-right:0;}
	/*.pagerLeft a i,.pagerRight a i{ top:80%;}*/
	.pagerLeft a{position:absolute; top:0; left:0; width:10%; height:100%; display:block; box-sizing:border-box; padding-top:20%; text-align:center; font-size:18px; color:#232323;}
	.pagerRight a{display:block; position:absolute; width:10%; height:100%; top:0; right:0; box-sizing:border-box; padding-top:20%; text-align:center; font-size:18px; color:#232323;}
	.worksYears ul li{width:33.3%;}
	.worksYears ul li{border-bottom:1px dashed #cccccc;}
	.worksYears ul li:nth-child(3n){border-right:none;}
	/*.worksYears ul li:nth-child(7),.worksYears ul li:last-child{border-bottom:none;}*/
	.worksYears ul li:last-child{border-right:1px dashed #cccccc;}
	footer{text-align:center;}
	.worksListArea ul li{width: calc(50% - 6%); margin-right:2%; margin-bottom:2%;}
	.worksListArea ul li:nth-child(even){ margin-right:0;}
	.worksListArea ul li:nth-child(2n+1) {margin-right: 4%;margin-left: 4%;}
	.topContents h1 img {width: 56%;}
}

html, body {
    height: 100%;
    margin: 0!important;
    padding: 0!important;
}

.bg-switcher {
    width: 100vw;
    height: 100vh;
    background-position: center center;
    background-size: cover;
    display: flex;
	flex-flow: row wrap;
    align-items: center;
    justify-content: center;
}
.bg-title {
    color: #fff;
    font-size: 5vw;
    line-height: 1.5;
    font-weight: bold;
    text-align: center;
}

.topArea{overflow:hidden;}
.topContents h1{width:auto; text-align: center; margin:auto; max-width: 100%;}
.topContents .topMenu{width:100%; text-align: center; margin-top:15px}
.topContents ul{width:100%; text-align: center; display:flex;justify-content: center;}
.topContents .topMenu ul li{margin-right:15px;}
.topContents .topMenu ul li:last-child{margin-right:0;}
.topContents .topMenu ul li a{color:#ffffff; font-size:18px; }

.backtolist{
	display: none;
}

@media only screen and (max-width: 479px) {
.backtolist{
	display: block;
	border-top:1px #cccccc dashed;
	text-align: center;
}
.backtolist a{
	display: block;
	padding:20px 0;
	background:#f0f0f0;
}
}

.pcnone{
	display: none;
}

.spnone{
	display: block;
}

@media only screen and (max-width: 779px) {
	.pcnone{
	display: block;
}

.spnone{
	display: none;
}
}



