@charset "UTF-8";

.sp,
.brSp {
display: none;
}

.pc,
.brPc {
display: inline-block;
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 100;
src: url("../font/NotoSansJP-Thin.woff2") format("woff2"), url("../font/NotoSansJP-Thin.woff") format("woff"), url("../font/NotoSansJP-Thin.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 200;
src: url("../font/NotoSansJP-Light.woff2") format("woff2"), url("../font/NotoSansJP-Light.woff") format("woff"), url("../font/NotoSansJP-Light.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 300;
src: url("../font/NotoSansJP-DemiLight.woff2") format("woff2"), url("../font/NotoSansJP-DemiLight.woff") format("woff"), url("../font/NotoSansJP-DemiLight.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 400;
src: url("../font/NotoSansJP-Regular.woff2") format("woff2"), url("../font/NotoSansJP-Regular.woff") format("woff"), url("../font/NotoSansJP-Regular.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 500;
src: url("../font/NotoSansJP-Medium.woff2") format("woff2"), url("../font/NotoSansJP-Medium.woff") format("woff"), url("../font/NotoSansJP-Medium.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 700;
src: url("../font/NotoSansJP-Bold.woff2") format("woff2"), url("../font/NotoSansJP-Bold.woff") format("woff"), url("../font/NotoSansJP-Bold.ttf") format("truetype");
}

@font-face {
font-family: 'Han Sans Japanese';
font-style: normal;
font-weight: 900;
src: url("../font/NotoSansJP-Black.woff2") format("woff2"), url("../font/NotoSansJP-Black.woff") format("woff"), url("../font/NotoSansJP-Black.ttf") format("truetype");
}

body {
font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
-webkit-text-size-adjust: 100%;
vertical-align: baseline;
text-rendering : optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
line-height: 1.7;
color: #221815;
background: #fbfaf8 url(../images/all_line.png) left top repeat;
}

.fontset {
font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.sans {
font-family: 'Han Sans Japanese';
}

.en {
font-family: 'Inconsolata', monospace;
}

a {
text-decoration: none;
color: #000;
outline: none;
}

a:not(.none):hover {
opacity: .7;
}

img {
border: 0px;
vertical-align: top;
-webkit-backface-visibility: hidden;
}

button,
input:not([type=checkbox]):not([type=radio]),
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 0;
outline: none;
}

:placeholder-shown {
color:#999999;
}
::-webkit-input-placeholder {
color:#999999;
}
::-moz-placeholder {
color:#999999;
}
:-ms-input-placeholder {
color:#999999;
}

.clear {
clear: both;
}

.textImg {
text-indent: -9999px;
}

.smallText {
font-weight: normal;
}

.biggerText {
font-weight: bold;
}

.boldText {
font-weight: bold;
}

.left {
text-align: left;
}

.right {
text-align: right;
}

.leftSet {
float: left;
}

.rightSet {
float: right;
}

.centerSet {
text-align: center;
}

.alert {
color: #FF0000;
}

strong {
font-weight: bold;
}

em {
font-style: normal;
}

.imgMax {
max-width: 100%;
height: auto;
}

.imgover {
cursor: pointer;
}

.alpha {
filter: alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}

/* -----------------------------------------------
base
----------------------------------------------- */
.inner {
min-width: 1100px;
margin: 0 auto;
}

html,
body {
min-width: 1100px;
}

#page {
position: relative;
width: 100%;
min-width: 1100px;
overflow-x: hidden;
}

/* -----------------------------------------------
loader
----------------------------------------------- */
#loadBox {
height: 100%;
width: 100%;
position: fixed;
background: #FFF;
z-index: 1001;
}

#loadBox img {
width: 91px;
height: 29px;
position: absolute;
margin: -80px auto 0 auto;
left: 0;
right: 0;
top: 50%;
}

#cssload-loader {
position: absolute;
margin: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 36px;
height: 26px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform-origin: center center;
-webkit-transform-origin: center center;
}

#cssload-loader ul {
margin: 0;
list-style: none;
width: 36px;
height: 26px;
position: relative;
padding: 0;
}

#cssload-loader ul li {
position: absolute;
width: 1px;
height: 0;
background-color: rgb(0,0,0);
bottom: 0;
}

#cssload-loader li:nth-child(1) {
left: 0;
animation: cssload-sequence1 1.15s ease infinite 0;
-webkit-animation: cssload-sequence1 1.15s ease infinite 0;
}

#cssload-loader li:nth-child(2) {
left: 6px;
animation: cssload-sequence2 1.15s ease infinite 0.12s;
-webkit-animation: cssload-sequence2 1.15s ease infinite 0.12s;
}

#cssload-loader li:nth-child(3) {
left: 12px;
animation: cssload-sequence1 1.15s ease-in-out infinite 0.23s;
-webkit-animation: cssload-sequence1 1.15s ease-in-out infinite 0.23s;
}

#cssload-loader li:nth-child(4) {
left: 18px;
animation: cssload-sequence2 1.15s ease-in infinite 0.35s;
-webkit-animation: cssload-sequence2 1.15s ease-in infinite 0.35s;
}

#cssload-loader li:nth-child(5) {
left: 24px;
animation: cssload-sequence1 1.15s ease-in-out infinite 0.46s;
-webkit-animation: cssload-sequence1 1.15s ease-in-out infinite 0.46s;
}

#cssload-loader li:nth-child(6) {
left: 30px;
animation: cssload-sequence2 1.15s ease infinite 0.58s;
-webkit-animation: cssload-sequence2 1.15s ease infinite 0.58s;
}
 @keyframes cssload-sequence1 {
 0% {
 height: 4px;
}
 50% {
 height: 20px;
}
 100% {
 height: 4px;
}
}
 @-webkit-keyframes cssload-sequence1 {
 0% {
 height: 4px;
}
 50% {
 height: 20px;
}
 100% {
 height: 4px;
}
}
 @keyframes cssload-sequence2 {
 0% {
 height: 8px;
}
 50% {
 height: 26px;
}
 100% {
 height: 8px;
}
}
 @-webkit-keyframes cssload-sequence2 {
 0% {
 height: 8px;
}
 50% {
 height: 26px;
}
 100% {
 height: 8px;
}
}

/* -----------------------------------------------
transition
----------------------------------------------- */
@media only screen and (min-width: 768px) {

a:not(.none) {
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
}

/* -----------------------------------------------
clearfix
----------------------------------------------- */
.clearfix:before,
.clearfix:after {
content: "";
display: block;
overflow: hidden;
}

.clearfix:after {
clear: both;
}

.clearfix {
zoom: 1;
}

/* -----------------------------------------------
textBt
----------------------------------------------- */

.textBt {
font-size: 18px;
text-align: center;
padding-top: 60px;
position: relative;
z-index: 1;
}

.textBt a {
display: inline-block;
line-height: 45px;
position: relative;
background: #FFF;
text-align: center;
letter-spacing: 10px;
text-indent: 10px;
position: relative;
color: #a18359;
height: 45px;
}

.textBt a span {
position: relative;
display: inline-block;
padding: 0 100px;
height: 45px;
}

.textBt a span::before,
.textBt a span::after {
content: "";
display: block;
position: absolute;
height: 1px;
background: #a18359;
right: 30px;
top: 50%;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

.textBt a:hover span::before,
.textBt a:hover span::after {
right: 20px;
}

.textBt a span::before {
width: 50px;
}

.textBt a span::after {
width: 10px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform-origin: right bottom;
-webkit-transform-origin: right bottom;
}

.textBt a::before {
-webkit-transition: all .3s ease;
transition: all .3s ease;
content: "";
display: block;
width: 0;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: rgba(161,131,81,0.30);
}

.textBt a:hover::before {
width: 100%;
}

/* -----------------------------------------------
header
----------------------------------------------- */

#topArea {
position: relative;
}

#topArea::after {
content: "";
width: 210px;
height: 100%;
left: 210px;
top: 0;
background: rgba(161,131,81,0.05);
position: absolute;
}

#topArea::before {
content: "";
width: 210px;
height: 100%;
left: 0px;
top: 0;
background: url(../images/logo_image.svg) top right no-repeat;
position: absolute;
}

#globalHeader {
text-align: center;
position: relative;
width: 100%;
z-index: 1000;
height: 150px;
}

#globalHeader h1 {
position: absolute;
left: 210px;
bottom: -11px;
width: 210px;
}

#globalHeader nav {
position: absolute;
left: 420px;
bottom: 0;
text-align: left;
font-size: 0;
}

#globalHeader nav li {
font-size: 16px;
letter-spacing: 3px;
line-height: 1;
display: inline-block;
font-family: 'Inconsolata', monospace;
margin-left: 30px;
}

#globalHeader nav li a {
display: inline-block;
position: relative;
padding-left: 30px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
white-space: nowrap;
}

#globalHeader nav li.active a,
#globalHeader nav li a:hover {
color: #c795b2;
}

#globalHeader nav li.active a::before,
#globalHeader nav li a::before {
content: "";
position: absolute;
left: 0;
bottom: 0;
display: block;
height: 50px;
width: 1px;
background: #c795b2;
transform: rotate(45deg);
transform-origin: center bottom;
-webkit-transform: rotate(45deg);
-webkit-transform-origin: center bottom;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

#globalHeader nav li.active a::before,
#globalHeader nav li a:hover::before {
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
height: 25px;
}

#spMenuOver {
width: 55px;
height: 100px;
top: 50px;
right: 30px;
position: fixed;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

#spMenuOver.open {
top: 0px;
right: 0px;
width: 100%;
height: 100%;
background: #c795b2;
}

#spMenuOver ul {
position: fixed;
width: 100%;
left: 0;
top: -364px;
margin: auto;
height: 364px;
}

#spMenuOver.open ul {
top: 0;
bottom: 0;
}

#spMenuOver ul li {
opacity: 0;
-webkit-transform: translateY(50px);
transform: translateY(50px);
}

#spMenuOver.open ul li {
opacity: 1;
-webkit-transition: all .3s ease;
transition: all .3s ease;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}

#spMenuOver.open ul li:nth-child(1) {
transition-delay: .3s;
}

#spMenuOver.open ul li:nth-child(2) {
transition-delay: .4s;
}

#spMenuOver.open ul li:nth-child(3) {
transition-delay: .5s;
}

#spMenuOver.open ul li:nth-child(4) {
transition-delay: .6s;
}

#spMenuOver.open ul li:nth-child(5) {
transition-delay: .7s;
}

#spMenuOver ul li:not(:first-child)::before {
content: "";
position: absolute;
left: 50%;
top: 15px;
display: block;
height: 25px;
width: 1px;
background: #FFF;
transform: rotate(45deg);
transform-origin: center center;
-webkit-transform: rotate(45deg);
-webkit-transform-origin: center center;
}

#spMenuOver ul li {
padding-top: 55px;
font-size: 24px;
line-height: 1;
font-family: 'Inconsolata', monospace;
letter-spacing: 10px;
text-indent: 10px;
color: #FFF;
position: relative;
}

#spMenuOver ul li:first-child {
padding-top: 0;
}

#spMenuOver ul li a {
display: inline-block;
color: #FFF;
white-space: nowrap;
}

#spMenu {
width: 55px;
height: 100px;
top: 50px;
right: 30px;
background: #c795b2;
position: fixed;
}

#spMenu > span {
display: block;
position: absolute;
width: 100%;
color: #FFF;
font-size: 12px;
line-height: 1;
font-family: 'Inconsolata', monospace;
text-align: center;
left: 0;
bottom: 4px;
letter-spacing: 1px;
text-indent: 1px;
}

#spMenu.open > span {
display: none;
}

#menuNavi {
display: block;
width: 55px;
height: 100px;
position: absolute;
left: 0;
top: 0px;
}

/*1本目*/
#menuNavi:before {
content: "";
width: 50px;
height: 1px;
display: inline-block;
position: absolute;
top: 35px;
left: 0px;
transform: rotate(-45deg);
transform-origin: left top;
-webkit-transform: rotate(-45deg);
-webkit-transform-origin: left top;
background: #FFF;
}

#spMenu.open #menuNavi:before {
}

/*2本目*/
#menuNavi>i {
width: 50px;
height: 1px;
position: absolute;
top: 50px;
left: 0px;
display: inline-block;
transform: rotate(-45deg);
transform-origin: left top;
-webkit-transform: rotate(-45deg);
-webkit-transform-origin: left top;
background: #FFF;
-webkit-transition: all .3s ease;
transition: all .3s ease;
opacity: 1;
}

#spMenu.open #menuNavi > i {
opacity: 0;
}

/*3本目*/
#menuNavi:after {
content: "";
width: 50px;
height: 1px;
display: inline-block;
position: absolute;
top: 65px;
left: 0px;
transform: rotate(-45deg);
transform-origin: left top;
-webkit-transform: rotate(-45deg);
-webkit-transform-origin: left top;
-webkit-transition: all .3s ease;
transition: all .3s ease;
background: #FFF;
}

#spMenu.open #menuNavi:after {
top: 0px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}

/* -----------------------------------------------
footer
----------------------------------------------- */
#globalFooter {
border-top: rgba(161,131,81,0.3) solid 1px;
font-family: 'Inconsolata', monospace;
text-align: center;
padding: 60px 0;
}

#globalFooter h2 {
padding-bottom: 30px;
}

#globalFooter li {
display: inline-block;
font-size: 14px;
padding: 0 10px;
white-space: nowrap;
}

#globalFooter p#copyright {
font-size: 10px;
opacity: 0.5;
padding-top: 30px;
}

/* -----------------------------------------------
kv
----------------------------------------------- */

#kv {
margin-top: 30px;
height: 580px;
position: relative;
}

#kvSlide::after {
content: "";
background: url(../images/all_line2.png) left top repeat;
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}

#kvSlide {
width : -webkit-calc(100% - 420px);
width : calc(100% - 420px);
height: 550px;
right: 0;
top: 0;
opacity: 0.8;
position: absolute;
overflow: hidden;
}

.kv-img {
width: 100%;
height: 550px;
}

.kv1 {
background: url(../images/ph1.jpg) no-repeat center center;
background-size: cover;
}

.kv2 {
background: url(../images/ph2.jpg) no-repeat center center;
background-size: cover;
}

.kv3 {
background: url(../images/ph3.jpg) no-repeat center center;
background-size: cover;
}

.kv4 {
background: url(../images/ph4.jpg) no-repeat center center;
background-size: cover;
}

.kv5 {
background: url(../images/ph5.jpg) no-repeat center center;
background-size: cover;
}

.kv6 {
background: url(../images/ph6.jpg) no-repeat center center;
background-size: cover;
}

#kv h2 {
position: absolute;
top: 50%;
left: 210px;
font-size: 18px;
letter-spacing: 20px;
line-height: 1;
font-weight: 200;
margin-top: -43px
}

#kv h2 span {
display: block;
background: #FFF;
margin: 10px 0;
padding: 5px 0 5px 10px;
}

/* -----------------------------------------------
top
----------------------------------------------- */

.topBlock {
text-align: center;
position: relative;
}

.topBlock h2 {
font-family: 'Inconsolata', monospace;
line-height: 1;
display: inline-block;
position: relative;
}

.topBlock h2 span {
display: block;
padding: 0 100px 3px 100px;
position: relative;
z-index: 1;
}

.topBlock h2::after {
content: "";
display: inline-block;
height: 13px;
width: 100%;
background: #FFF;
position: absolute;
bottom: 0;
left: 0;
}

#news {
padding: 60px 0 50px 0;
background: rgba(199,149,178,0.20);
text-align: left;
overflow: hidden;
position: relative;
}

#news::after {
content: "";
width: 210px;
height: 100%;
left: 210px;
top: 0;
background: rgba(161,131,81,0.05);
position: absolute;
}

#news h2 {
width: 355px;
position: relative;
float: left;
text-align: right;
letter-spacing: 10px;
margin-right: -10px;
font-size: 18px;
line-height: 1.3;
font-family: 'Inconsolata', monospace;
color: #c795b2;
}

#news h2::before {
content: "";
display: block;
position: absolute;
width: 2000px;
height: 1px;
background: #c795b2;
right: 10px;
top: 60px;
}

#news h2::after {
content: "";
display: block;
position: absolute;
width: 2000px;
height: 1px;
background: #c795b2;
right: 10px;
top: 60px;
transform: rotate(-45deg);
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
-webkit-transform-origin: right bottom;
}

.news-list {
margin-left: 420px;
overflow: hidden;
}

#contents .news-list {
margin-top: 60px;
}

.news-list li {
width: 210px;
margin-bottom: 10px;
float: left;
position: relative;
}

.news-list li a {
display: block;
width: 210px;
position: relative;
}

.news-list li a span.more {
width: 209px;
height: 209px;
background: #c795b2;
display: block;
position: relative;
}

.news-list li a span.more::before {
-webkit-transition: all .3s ease;
transition: all .3s ease;
content: "";
display: block;
width: 0;
height: 100%;
position: absolute;
left: 0;
top: 0;
background: rgba(0,0,0,0.30);
}

.news-list li a:hover span.more::before {
width: 100%;
}

.news-list li a span.more span {
position: absolute;
color: #FFF;
display: block;
width: 105px;
left: 0;
top: 50%;
margin-top: -19px;
font-size: 18px;
line-height: 1;
text-align: right;
letter-spacing: 10px;
}

.news-list li a span.more span::before,
.news-list li a span.more span::after {
content: "";
display: block;
position: absolute;
height: 1px;
background: #FFF;
bottom: -10px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

.news-list li a span.more span::before {
width: 105px;
left: 0px;
}

.news-list li a span.more span::after {
right: 0;
width: 10px;
transform: rotate(-45deg);
transform-origin: right bottom;
-webkit-transform: rotate(-45deg);
-webkit-transform-origin: right bottom;
}

.news-list li a:hover span.more span::before {
width: 115px;
}

.news-list li a:hover span.more span::after {
right: -10px;
}

.news-list li a > p,
.news-list li a h3 {
position: absolute;
z-index: 1;
}

.news-list li a h3 {
bottom: 0;
color: #FFF;
font-size: 15px;
line-height: 25px;
font-weight: bold;
padding: 10px 10px 5px 10px;
}

.news-list li a > p {
color: #FFF;
background: #c795b2;
line-height: 1;
font-size: 12px;
padding: 3px;
}

.news-list li a .image {
position: relative;
width: 209px;
height: 209px;
overflow: hidden;
opacity: 0.8;
}

.news-list li a .image img {
width: 209px;
height: auto;
}

.news-list li a .image img {
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

.news-list li a:hover .image img {
transform: scale(1.05, 1.05);
-webkit-transform: scale(1.05, 1.05);
opacity: 1;
}

.news-list li a .image::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.50);
z-index: 1;
}

.news-list li .text p {
padding-right: 15px;
font-size: 13px;
line-height: 1.5;
padding-top: 10px;
padding-bottom: 20px;
color: rgba(0,0,0,0.70);
}

#concept {
padding: 100px 0;
background: url(../images/concept_bg.png) center bottom no-repeat;
}

#concept h2 {
font-size: 24px;
letter-spacing: 10px;
text-indent: 10px;
color: #a18359;
}

#concept h3::before {
content: "";
position: absolute;
left: 50%;
top: 25px;
display: block;
height: 50px;
width: 1px;
background: #a18359;
transform: rotate(45deg);
transform-origin: center center;
-webkit-transform: rotate(45deg);
-webkit-transform-origin: center center;
}

#concept h3 {
position: relative;
font-size: 24px;
color: #a4875e;
letter-spacing: 10px;
text-indent: 10px;
line-height: 1;
padding-top: 100px;
padding-bottom: 50px;
font-weight: 200;
}

#concept p {
font-size: 15px;
line-height: 41px;
letter-spacing: 3px;
text-indent: 3px;
font-weight: 200;
margin-bottom: 1em;
}

#concept p:last-child {
margin-bottom: 0;
}

#works {
background: #FFF url(../images/all_line.png) left top repeat;
display: flex;
display: -webkit-flex;
align-items: stretch;
width: 100%;
}

#works .image {
width: 50%;
background: url(../images/ph7.jpg) no-repeat center center;
background-size: cover;
position: relative;
}

#works .image::after {
content: "";
background: url(../images/all_line2.png) left top repeat;
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}

#works .textArea {
padding: 60px 0;
width: 50%;
}

#works h2 {
font-size: 24px;
letter-spacing: 10px;
text-indent: 10px;
color: #c795b2;
}

#works h2::after {
background: #f8f2f4;
}

#works .textBt {
padding-top: 30px;
}

#works .textBt a {
color: #c795b2;
background: #f8f2f4;
}

#works .textBt a::before {
background: rgba(199,149,178,0.30);
}

#works .textBt a span::before,
#works .textBt a span::after {
background: #c795b2;
}

#works .lead {
padding-top: 30px;
color: #c795b2;
font-size: 18px;
font-weight: 400;
}

#contact {
background: url(../images/all_line2.png) left top repeat, url(../images/contact_bg.png) center bottom no-repeat;
background-color: #cebea8;
position: relative;
}

#contact .gradient {
padding: 60px 0 210px 0;
background: -moz-linear-gradient(left, rgba(231,217,124,0.5) 0%, rgba(161,131,89,0.5) 100%);
background: -webkit-linear-gradient(left, rgba(231,217,124,0.5) 0%, rgba(161,131,89,0.5) 100%);
background: linear-gradient(to right, rgba(231,217,124,0.5) 0%, rgba(161,131,89,0.5) 100%);
}

#prticle {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}

#contact h2 {
font-size: 36px;
letter-spacing: 10px;
text-indent: 10px;
color: #FFF;
}

#contact h2::after {
background: rgba(255,255,255,0.30);
}

#contact h3 {
padding-top: 30px;
font-size: 21px;
color: #FFF;
}

#contact .textBt {
padding-top: 30px;
}

#contact .textBt a {
color: #FFF;
background: #a18359;
}

#contact .textBt a::before {
background: rgba(0,0,0,0.30);
}

#contact .textBt a span::before,
#contact .textBt a span::after {
background: #FFF;
}

/* -----------------------------------------------
subpage
----------------------------------------------- */
#subpage #main {
padding-top: 60px;
}

#contents {
position: relative;
min-height: 340px;
}

.contents-bg {
content: "";
position: absolute;
display: block;
background: url(../images/ph6.jpg) no-repeat center center;
background-size: cover;
left: 210px;
top: -60px;
height: 400px;
width : -webkit-calc(100% - 210px);
width : calc(100% - 210px);
opacity: 0.2;
overflow: hidden;
}

.concept .contents-bg {
background: url(../images/ph4.jpg) no-repeat center center;
}

.contact .contents-bg {
background: url(../images/ph1.jpg) no-repeat center center;
}

.works .contents-bg {
background: url(../images/ph7.jpg) no-repeat center center;
}

#contents::before {
content: "";
position: absolute;
display: block;
left: 0px;
top: 340px;
width: 100%;
height: 1px;
background: rgba(161,131,81,0.3);
z-index: 1;
}

#titleArea {
margin-left: 210px;
padding: 60px 0 60px 0;
background: rgba(199,149,178,0.20);
}

#titleArea p,
#titleArea h1 {
font-family: 'Inconsolata', monospace;
font-size: 24px;
letter-spacing: 20px;
padding-left: 90px;
color: #c795b2;
position: relative;
}

#titleArea p::before,
#titleArea h1::before {
content: "";
position: absolute;
left: 30px;
bottom: 0;
display: block;
height: 50px;
width: 1px;
background: #c795b2;
transform: rotate(45deg);
transform-origin: center bottom;
-webkit-transform: rotate(45deg);
-webkit-transform-origin: center bottom;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}

#entry {
letter-spacing: 1px;
position: relative;
z-index: 1;
margin-left: 420px;
width : -webkit-calc(100% - 420px);
width : calc(100% - 420px);
max-width: 1050px;
padding: 30px 30px 100px 30px;
margin-top: 60px;
box-sizing: border-box;
background: #FFF url(../images/all_line.png) left top repeat;
min-height: 340px;
}

#entry h1,
#entry h2 {
font-size: 24px;
color: #a4875e;
letter-spacing: 10px;
line-height: 1.5;
margin-top: 30px;
margin-bottom: 30px;
}

#entryBlock a {
text-decoration: underline;
}
#entry.page h3,
#entryBlock h2 {
font-size: 21px;
margin-top: 30px;
margin-bottom: 30px;
font-weight: bold;
letter-spacing: 3px;
color: #a4875e;
}

#entry.page h4,
#entryBlock h3 {
font-size: 18px;
margin-top: 30px;
margin-bottom: 30px;
font-weight: bold;
padding-left: 40px;
position: relative;
}

#entry.page h4::before,
#entryBlock h3::before {
content: "";
height: 18px;
width: 18px;
border: #a4875e solid 2px;
position: absolute;
display: block;
left: 0;
top: 0;
bottom: 0;
margin: auto;
border-radius: 50%;
}

#entry.page h5,
#entryBlock h4 {
font-size: 18px;
margin-top: 30px;
margin-bottom: 30px;
font-weight: normal;
padding-bottom: 10px;
border-bottom: rgba(161,131,81,0.3) solid 1px;
color: #a4875e;
}

#entry.page h6,
#entryBlock h5 {
font-size: 15px;
margin-top: 30px;
margin-bottom: 30px;
font-weight: bold;
color: #a4875e;
background: rgba(161,131,81,0.05);
padding: 5px;
}

#entryBlock h6 {
font-size: 15px;
margin-top: 30px;
margin-bottom: 30px;
font-weight: bold;
}

#entryBlock table {
width: 100%;
}

#entryBlock table tr,
#entryBlock table td {
padding: 1em;
border: rgba(161,131,81,0.3) solid 1px;
}

#entryBlock table td {
background: rgba(161,131,81,0.05);
}

#entryBlock table th {
background: rgba(161,131,81,0.1);
}

.column {
margin: 30px 0;
background: rgba(161,131,81,0.2);
padding: 15px;
}

.columnBl {
margin: 30px 0;
background: #c795b2;
padding: 15px;
color: #FFF;
}

.columnBl p:last-child,
.column p:last-child {
margin-bottom: 0;
}

#entry p {
font-size: 15px;
line-height: 35px;
margin-bottom: 1em;
}

#entry .lead {
font-size: 16px;
line-height: 36px;
font-weight: bold;
color: #a4875e;
}

#entry ul {
font-size: 15px;
line-height: 35px;
margin-left: 1.5em;
list-style: disc;
margin-bottom: 1em;
}

.name{
background: rgba(199,149,178,0.20);
padding: 3px;
}
.formTable {
width: 100%;
font-size: 16px;
line-height: 38px;
margin-bottom: 30px;
margin-top: 30px;
border-top: rgba(161,131,81,0.3) solid 1px;
}

.formTable td,
.formTable th {
padding: 15px;
border-bottom: rgba(161,131,81,0.3) solid 1px;
vertical-align: top;
background: rgba(161,131,81,0.05);
}

.formTable th {
text-align: left;
font-weight: normal;
padding-right: 15px;
border-right: rgba(161,131,81,0.3) solid 1px;
color: #a4875e;
white-space: nowrap;
}

.formTable td {
padding-left: 15px;
}

input[type="text"],
textarea {
border: rgba(161,131,81,0.3) solid 1px;
position: relative;
background: rgba(161,131,81,0.1);
padding: 5px 10px;
font-size: 15px;
line-height: 25px;
color: #000;
min-height: 20px;
box-sizing: border-box;
width: 100%;
}

.postBt {
}

.postBt input {
padding: 15px 100px;
font-size: 21px;
background-color: #a4875e;
color: #fff;
border-style: none;
position: relative;
margin-right: 15px;
}

.error {
font-size: 12px;
line-height: 1.3;
color: #FF0004;
display: block;
padding-top: 5px;
}

.mainImage {
padding-top: 30px;
padding-bottom: 60px;
}

.mainImage img {
max-width: 100%;
height: auto;
}

.aligncenter {
display: block;
margin: 0 auto;
}

.alignright {
float: right;
margin-left: 10px;
}

.alignleft {
float: left;
margin-right: 10px;
}

img[class*="wp-image-"],
img[class*="attachment-"] {
height: auto;
max-width: 100%;
}

#entry .share {
border-top: rgba(161,131,81,0.3) solid 1px;
padding-top: 60px;
margin-top: 60px;
padding-bottom: 25px;
margin-left: 0;
}

.share li {
display: inline-block;
text-align: center;
padding: 10px;
}

.share li a {
display: inline-block;
font-size: 24px;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
color: #FFF;
}

.share li.twitter a {
background: #00aced;
}

.share li.facebook a {
background: #305097;
}

#nextprev {
margin-left: 420px;
overflow: hidden;
background: rgba(199,149,178,0.10);
}

#nextprev li {
width: 50%;
float: left;
text-align: center;
}

#nextprev li.prev i {
margin: 0 1em 0 0;
}

#nextprev li.next {
width: 50%;
float: right;
}

#nextprev li a i {
}

#nextprev li a {
display: block;
text-decoration: none;
padding: 10px 0;
color: #FFF;
}

#nextprev li.next a {
background: rgba(199,149,178,0.60);
margin-right: 1px;
}

#nextprev li.prev {
background: rgba(199,149,178,0.60);
}

#nextprev li a:hover {
background: rgba(199,149,178,1);
}

.pagination {
margin-left: 420px;
}

.pagination ul {
display: -webkit-flex;
display: flex;
width: 100%;
-webkit-align-items: stretch;
align-items: stretch;
margin: 15px 0 0px 0;
background: rgba(199,149,178,0.30);
}

.pagination li {
-webkit-flex-grow: 1;
flex-grow: 1;
text-align: center;
}

.pagination li span,
.pagination li a {
border-left: #FFF solid 1px;
display: block;
padding: 15px 10px;
line-height: 1;
color: rgba(0,0,0,0.50);
}

.pagination li:first-child a,
.pagination li:first-child span {
border: none;
}

.pagination li span,
.pagination li a:hover {
background: rgba(199,149,178,0.6);
color: #FFF;
}