@charset "utf-8";
/*
Theme Name: ポーターズペイント
Theme URI: http://example.com/
Description: 
Version: 1.0
Author: nextsolutions
Author URI: http://www.nextsolutions.co.jp/
*/

/* Reset.css */
@import 'css/reset.css';
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);


html, body {
    font-size: 100%;
    line-height: 170%;
    position: relative;
    height: 100%;
font-weight:200;
color:#666666;
    font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
}

.cont-box {
text-align:center;
}


#sitemap {
padding:50px 0;
}

#p1,#p2 {
font-size:19px;
padding-bottom:10px;
}

#related2 .col__lg--6 {
  overflow: hidden;

}

#g-box .col__lg--3 {
  overflow: hidden;

}

#producttile .col__lg--4 {
  overflow: hidden;

}

figure {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  background: #fff;
  overflow: hidden;
}

figure img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
figure:hover img {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}
@-webkit-keyframes shine {
  100% {
    left: 125%;
  }
}
@keyframes shine {
  100% {
    left: 125%;
  }
}

.blogcontents img {
padding-bottom:20px;
}

.about1box {
	position: relative;
}

#report img {
width:100%;
height:auto;
}


#report .col {
margin-bottom:20px;
}

#products {
margin-top:50px;
}


#products img {
width:100%;
height:auto;
}

.mask {
overflow:hidden;
}

#concept .maint {
font-size:29px;
font-weight:700;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
line-height:140%;
padding-bottom:0px;
margin-bottom:10px;
}


.min {
font-size:30px;
font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
line-height:140%;
padding-bottom:20px;
}

#concept p {
margin-bottom:50px;
}

.main-text {
width:50%;
float:right;
}

.main-contents {
padding:0 80px;
font-size:15px;
line-height:190%;
}


.main-contents p {
margin-bottom:30px;
}

.day {
font-family: 'Lato', sans-serif;
font-weight:700;
font-size:15px;
}

.right_content li {
padding-bottom:10px;
font-family: 'Lato', sans-serif;
font-weight:500;

}


#about-section2 .col {
padding-left:0;
padding-right:0;
}

.breadcrumbs {
font-size:12px;
color:#999999;
margin-top:60px;
}

#single .breadcrumbs {
margin-top:30px;
}

#about-section1 h2{
margin:20px 0 20px 0;
display:inline-block;
}


.rephoto{
  overflow: hidden;

}

.rettl {
margin:15px 0;
font-size:14px;
}

.rettl em {
display:block;
font-style:normal;
}

.rettl table {
    border-top: 1px solid #555555;
    border-right: 1px solid #555555;
    border-left: 1px solid #555555;
width:100%;
font-size:13px;
}

.rettl th {
    padding: 5px;
    border-bottom: 1px solid #555555;
text-align:left;
font-weight:700;
vertical-align:middle;
background-color:#F7F7F7;
width:100px;
}

.rettl td {
    padding: 5px;
    border-bottom: 1px solid #555555;
    border-left: 1px solid #555555;
}

.rettl p {
float:left;
padding:5px 10px 5px 0;
font-weight:500;
font-size:13px;
}

.rettl span {
color:#FFFFFF;
display:inline-block;
padding:0;
margin-right:10px;
}

.rettl2 {
margin:15px 0;
font-size:14px;
}


.related-link {
float:right;
background-color:#E9E9E9;
padding:20px 10px;
width:400px;
margin-top:30px;
margin-right:10px;
}

.ans:after {
  content: ".";  /* 譁ｰ縺励＞隕∫ｴ繧剃ｽ懊ｋ */
  display: block;  /* 繝悶Ο繝�け繝ｬ繝吶Ν隕∫ｴ縺ｫ */
  clear: both;
}

.faqbox {
border-bottom:1px dotted #AAAAAA;
margin-bottom:60px;
}

.related-link strong {
display:block;
}

.related-link a {
display:block;
}


#second #faq h2 {
position: relative;
border-bottom:initial;
margin:20px 0;
font-size:23px;
font-weight:500;
color:#FFFFFF;
padding:10px;
background-color:#231815;
}

#second #faq h3 {
	position: relative;
	text-align: center;
border-bottom:initial;
margin:50px 0;
font-size:21px;
font-weight:500;
}
#second #faq h3 span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 2.5em;
	padding: 0 1em;
	background-color: #fff;
	text-align: left;
}
#second #faq h3::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background-color: #ccc;
}
#g-box img {
width:100%;
height:auto;
}

#r-box img {
width:100%;
height:auto;
}

.container3 {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

.clear {
clear:both;
height:100px;
display:block;
}

.clear2 {
clear:both;
height:50px;
display:block;
}

#about-btn {
position:relative;
    max-width: 1200px;
margin:0 auto;
}

.hantoumei .button2 {
position:absolute;
bottom:-30px;
right:30px;
}


#about-section2 p{
margin-top:150px;
}

.ratio-1_1:before {
    content: "";
    display: block;
    padding-top: 70%; /* 1:1 */
}

#sitemap li a:before {
    content: "\f02b";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;


}

.hantoumei {
background-color: rgba(0,0,0,0.7); 
color:#FFFFFF;
padding:30px;
position:absolute;
top:30px;
left:-100px;
width:600px;
}

.m-text {
line-height:195%;
padding-bottom:20px;
}

.hantoumei2 {
position:absolute;
top:0px;
left:100px;
height: 70%;
color:#000000;
z-index:100;
}

.container2 {
    max-width: 1000px;
    margin: 0 auto;
    box-sizing: border-box;
}


.col {
    position: relative;
}

#compamylink a {
diplay:inline-block;
padding:5px 0 0 30px;
}

#head .col {
padding-right:0;
padding-left:0;
}



.drawer-nav li a {
font-family: 'Lato', sans-serif;
font-weight:300;

}

.tags a {
float:left;
padding-right:10px;
font-weight:700;
font-size:20px;
padding-bottom:5px;
}

.tags a:after {
    content:"";
    display:table;
    clear: both;
}

.tags a:before {
    content: "\f02b";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
}

.next2 {
text-align:center;
background-color:#333333;
width:100%;
padding:15px 0;
}

.next2 a:before {
    content: "\f104";
    font-family: FontAwesome;
padding-left:10px;
float:left;
}


.prev2 {
text-align:center;
background-color:#333333;
width:100%;
padding:15px 0;
}

.prev2 a:after {
    content: "\f105";
    font-family: FontAwesome;
    float:right;
padding-right:10px;
}

.home {
text-align:center;
margin-top:20px;
}

.home a:after {
    content: "\f03a";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
font-size:20px;
}






.side_newpost li {
border-bottom:1px dotted #AAAAAA;
margin-bottom:5px;
padding:10px 0;
}

.side_search .col {
padding-right:0;
padding-left:0;
}
form#searchform .boxRight {
    float: right;
    width: 68px;
}

.title-detail-data2 {
    padding: 0 0 6px 0;
    border-bottom: 4px solid #000;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: 2px;
    line-height: 1;
	display: table;
	margin: 35px 0 10px 0;
}

#footnavi {
background-color:#231815;
}

#footnavi ul {
	list-style-type: none;
	padding-left: 0;
}
#footnavi li {
	padding: 10px;
	margin: 20px 10px;
}

#footnavi li:hover {
	background-color:#666666;
}


.inline-block {
	text-align: center;
}
.inline-block li {
	display: inline-block;
}

#foot-contact img {
display:block;
}
#foot-contact h4 {
font-size:16px;
font-weight:400;
height:30px;
}

#foot-contact h4 .fa {
font-size:21px;

}

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


footer {
padding:30px 0;
font-size:12px;
position: relative;
}

.copy {
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid #CECECE;
    width: 100%;
    text-align: right;
}

a{text-decoration:none; color:#000000;}
a:link {text-decoration:none; color:#000000;}
a:visited {text-decoration:none; color:#000000;}
a:hover {text-decoration:none; color:#000000;}
a:active {text-decoration:none; color:#000000;}

.breadcrumbs a{text-decoration:none; color:#999999;}
.breadcrumbs a:link {text-decoration:none; color:#999999;}
.breadcrumbs a:visited {text-decoration:none; color:#999999;}
.breadcrumbs a:hover {text-decoration:none; color:#999999;}
.breadcrumbs a:active {text-decoration:none; color:#999999;}

#top-section-blog h3 a{text-decoration:none; color:#EB611D;}
#top-section-blog h3 a:link {text-decoration:none; color:#EB611D;}
#top-section-blog h3 a:visited {text-decoration:none; color:#EB611D;}
#top-section-blog h3 a:hover {text-decoration:none; color:#EB611D;}
#top-section-blog h3 a:active {text-decoration:none; color:#EB611D;}


#blog h3 a{text-decoration:none; color:#EB611D;}
#blog h3 a:link {text-decoration:none; color:#EB611D;}
#blog h3 a:visited {text-decoration:none; color:#EB611D;}
#blog h3 a:hover {text-decoration:none; color:#EB611D;}
#blog h3 a:active {text-decoration:none; color:#EB611D;}


.map a{text-decoration:none; color:#EB611D;}
.map a:link {text-decoration:none; color:#EB611D;}
.map a:visited {text-decoration:none; color:#EB611D;}
.map a:hover {text-decoration:none; color:#EB611D;}
.map a:active {text-decoration:none; color:#EB611D;}

.button a{text-decoration:none; color:#898989;display:block;text-align:center;}
.button a:link {text-decoration:none; color:#898989;}
.button a:visited {text-decoration:none; color:#898989;}
.button a:hover {text-decoration:none; color:#FFFFFF;}
.button a:active {text-decoration:none; color:#898989;}

.mapbtn a{text-decoration:none; color:#666666;display:block;text-align:center;}
.mapbtn a:link {text-decoration:none; color:#666666;}
.mapbtn a:visited {text-decoration:none; color:#666666;}
.mapbtn a:hover {text-decoration:none; color:#666666;}
.mapbtn a:active {text-decoration:none; color:#666666;}

.button2 a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
.button2 a:link {text-decoration:none; color:#FFFFFF;}
.button2 a:visited {text-decoration:none; color:#FFFFFF;}
.button2 a:hover {text-decoration:none; color:#FFFFFF;}
.button2 a:active {text-decoration:none; color:#FFFFFF;}

.button-alfa a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
.button-alfa a:link {text-decoration:none; color:#FFFFFF;}
.button-alfa a:visited {text-decoration:none; color:#FFFFFF;}
.button-alfa a:hover {text-decoration:none; color:#FFFFFF;}
.button-alfa a:active {text-decoration:none; color:#FFFFFF;}

#contbtn a{text-decoration:none; color:#FFFFFF;}
#contbtn a:link {text-decoration:none; color:#FFFFFF;}
#contbtn a:visited {text-decoration:none; color:#FFFFFF;}
#contbtn a:hover {text-decoration:none; color:#EB611D;}
#contbtn a:active {text-decoration:none; color:#FFFFFF;}

.next2 a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
.next2 a:link {text-decoration:none; color:#FFFFFF;}
.next2 a:visited {text-decoration:none; color:#FFFFFF;}
.next2 a:hover {text-decoration:none; color:#FFFFFF;}
.next2 a:active {text-decoration:none; color:#FFFFFF;}


.prev2 a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
.prev2 a:link {text-decoration:none; color:#FFFFFF;}
.prev2 a:visited {text-decoration:none; color:#FFFFFF;}
.prev2 a:hover {text-decoration:none; color:#FFFFFF;}
.prev2 a:active {text-decoration:none; color:#FFFFFF;}

#related a{text-decoration:underline; color:#000000;}
#related a:link {color:#000000;}
#related a:visited {color:#000000;}
#related a:hover {color:#000000;}
#related a:active {color:#000000;}

#related .button2 a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
#related .button2 a:link {text-decoration:none; color:#FFFFFF;}
#related .button2 a:visited {text-decoration:none; color:#FFFFFF;}
#related .button2 a:hover {text-decoration:none; color:#FFFFFF;}
#related .button2 a:active {text-decoration:none; color:#FFFFFF;}

#related2 a{text-decoration:underline; color:#000000;}
#related2 a:link {color:#000000;}
#related2 a:visited {color:#000000;}
#related2 a:hover {color:#000000;}
#related2 a:active {color:#000000;}

#related2 .button2 a{text-decoration:none; color:#FFFFFF;display:block;text-align:center;}
#related2 .button2 a:link {text-decoration:none; color:#FFFFFF;}
#related2 .button2 a:visited {text-decoration:none; color:#FFFFFF;}
#related2 .button2 a:hover {text-decoration:none; color:#FFFFFF;}
#related2 .button2 a:active {text-decoration:none; color:#FFFFFF;}

#contact-section a{text-decoration:none; color:#FFFFFF;}
#contact-section a:link {text-decoration:none; color:#FFFFFF;}
#contact-section a:visited {text-decoration:none; color:#FFFFFF;}
#contact-section a:hover {text-decoration:none; color:#FFFFFF;}
#contact-section a:active {text-decoration:none; color:#FFFFFF;}

#footnavi a{text-decoration:none; color:#FFFFFF;}
#footnavi a:link {text-decoration:none; color:#FFFFFF;}
#footnavi a:visited {text-decoration:none; color:#FFFFFF;}
#footnavi a:hover {text-decoration:none; color:#FFFFFF;}
#footnavi a:active {text-decoration:none; color:#FFFFFF;}

#products a{text-decoration:underline;}
#products a:link {text-decoration:underline;}
#products a:visited {text-decoration:underline;}
#products a:hover {text-decoration:underline;}
#products a:active {text-decoration:underline;}

#related .flex p {
text-align:left;
margin:15px 0;
}

#related .flex h4 {
font-weight:700;
margin-top:15px;
font-size:17px;
}

#related2 .flex p {
text-align:left;
margin:15px 0;
}



#menu {
display:-webkit-box;
margin:auto;
}

#menu ul {
list-style:none;
border-left:1px solid #DDDDDD;
margin-left: auto;
}

#menu ul li {
float:left;
padding:15px 20px;
border-right:1px solid #DDDDDD;
font-weight:700;
display:inline-block; 
font-size:16px;
}

#menu li:last-child {
border-right:none;
}

#menu .social {
font-size:25px;
}

#menu2 {
display:-webkit-box;
margin:auto;
}

#menu2 ul {
list-style:none;
border-left:1px solid #DDDDDD;
margin-left: auto;
}

#menu2 ul li {
float:left;
padding:15px 20px;
border-right:1px solid #DDDDDD;
font-weight:700;
display:inline-block; 
font-size:13px;
}

#menu2 li:last-child {
border-right:none;
}

#menu2 .social {
font-size:25px;
}


#top-section3 {
padding:90px 0 0 0;
}

#top-section2 {
background-color:#EB611D;
color:#FFFFFF;
padding:90px 0;
}


#top-section2 h3 {
text-align:center;
font-size:17px;
margin-top:10px;
}

#top-section2 .col__lg--2 {
text-align:center;
margin:0 auto;
}

.eng-ttl {
font-family: 'Lato', sans-serif;
font-size:26px;
font-weight:400;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%); /* Safari用 */
  transform: translateY(-50%);

}

#second h2 {
font-family: 'Lato', sans-serif;
font-size:50px;
text-align:center;
margin-top:20px;
}

#second h2 span {
font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
font-size:16px;
display:block;
margin:30px 0 10px;
}

#second h3 {
font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
font-size:20px;
font-weight:500;
padding-bottom:5px;
margin-bottom:10px;
border-bottom:1px solid #666666;
}

#products h3 span {
display:block;
font-size:16px;
}

.g-workshop #second h3 {
  position: relative;
  text-align: center;
	border-bottom: initial;
margin-bottom:30px;
}
.g-workshop #second h3 span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
.g-workshop #second h3::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
}


.g-contactus #second h3 {
  position: relative;
  text-align: center;
	border-bottom: initial;
margin-bottom:30px;
font-weight:normal;
margin-top:50px;
}
.g-contactus #second h3 span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 1em;
  background-color: #fff;
  text-align: left;
}
.g-contactus #second h3::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #ccc;
}




#second h4 {
font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
font-size:16px;
font-weight:700;
padding-bottom:5px;
margin-bottom:10px;
border-bottom:1px dotted #666666;
margin-top:50px;
}

#second h5 {
font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
font-size:16px;
font-weight:700;
padding-bottom:5px;
margin-bottom:10px;
margin-top:50px;
}



#related {
background-color:#EEEEEE;
margin-top:60px;
text-align:center;
padding:30px 0;
font-size:16px;
position: relative;
}


#related3 {
background-color:#FFFFFF;
margin-top:40px;
text-align:center;
padding:30px 0;
font-size:16px;
position: relative;
}

#related2 {
background-color:#EEEEEE;
margin-top:60px;
text-align:center;
padding:80px 0 70px 0;
font-size:16px;
    position: relative;
}

#mapback {
max-width:1040px;
height:625px;
margin-bottom:100px;
    background: url(/common/images/shop/map-back.png) no-repeat top center;
	position: relative;
}

.mapbtn {
border:3px solid #666666;
width:180px;
padding:20px 0;
text-align:center;
font-size:18px;
font-weight:700;
}

.mapbtn:hover {
background-color:#EEEEEE;
}


.areatl {
border-bottom:4px solid #666666;
margin-top:30px;
}

.shopbox {
padding:20px 0;

font-size:15px;
}

.shopbox strong {
font-size:17px;
font-weight:bold;
display:inline-block;
padding:25px 0 10px 0;
}

.comment {
background-color:#EEEEEE;
padding:10px;
}

.comment em {
font-size:17px;
display:block;
font-family: 'Lato', sans-serif;
padding-bottom:10px;
font-style:italic;
}

.areatl p {
background-color:#666666;
padding:15px;
text-align:center;
font-size:20px;
font-weight:500;
color:#FFFFFF;
width:180px;
}

#related2 img {
width:100%;
height:auto;
}

#related h3 {
  left: 0;
  right: 0;
  margin:0 auto;
top:-15px;
font-family: 'Lato', sans-serif;
font-size:26px;
font-weight:700;
margin-bottom:50px;
position:absolute;
}


#related2 h3 {
  left: 0;
  right: 0;
  margin:0 auto;
top:-15px;
font-family: 'Lato', sans-serif;
font-size:26px;
font-weight:700;
margin-bottom:50px;
position:absolute;
}

#related2 h4 {
  left: 0;
background-color: rgba(255,255,255,0.6);  
  right: 0;
bottom:0;
font-size:17px;
font-weight:500;
position:absolute;
padding:10px;
}

#report h4 {
  left: 0;
background-color: rgba(255,255,255,0.6);  
  right: 0;
bottom:0;
font-size:13px;
position:absolute;
padding:10px;
border:initial;
text-align:center;
font-weight:300;
margin-bottom:initial;
}

.related {
	position: relative;
	text-align: center;
margin:60px 0 30px;
font-size:19px;
}
.related span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 2.5em;
	padding: 0 1em;
	background-color: #fff;
	text-align: left;
}
.related::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background-color: #ccc;
}

.category {
font-family: 'Lato', sans-serif;
font-size:16px;
color:#666666;
margin:20px 0;
}

#second {
font-size:13px;
line-height:190%;
}

#main-area {
padding:0 80px;
font-size:16px;
}

#main-area .col {
padding-left:0;
padding-right:0;
}

#maintext p {
padding:15px 15px 10px 0;
font-size:18px;
line-height:180%;
}

.pt50 {
padding-top:50px;
}



.button {
	display: inline-block;
	width: 460px;
	height: 70px;
	text-align: center;
	text-decoration: none;
	line-height: 70px;
font-family: 'Lato', sans-serif;
	outline: none;
margin-top:15px;
font-size:19px;
font-weight:500;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}




.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button {
	background-color: #FFF;
	border: 1px solid #898989;
	color: #898989;
}
.button {
  position: relative;
  z-index: 2;
  background-color: #fff;
  border: 1px solid #333;
  color: #333;
  line-height: 70px;
  overflow: hidden;
}
.button:hover {
  color: #fff;
}
.button::after {
  top: 100%;
  width: 100%;
  height: 100%;
}
.button:hover::after {
  top: 0;
  background-color: #333;
}
.button a:after {
    content: "\f003";
    font-family: FontAwesome;
    float:right;
padding-right:10px;
}




.button2 {
	display: inline-block;
	width: 250px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	line-height: 54px;
	outline: none;
font-family: 'Lato', sans-serif;
}
.button2::before,
.button2::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button2,
.button2::before,
.button2::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button2 {
	background-color: #000;
	color: #FFFFFF;
	line-height: 50px;
}
.button2:hover {
	background-color: #999;
	border-color: #333;
	color: #fff;
}
.button2 a:after {
    content: "\f105";
    font-family: FontAwesome;
    float:right;
padding-right:10px;
}




.button-alfa {
	display: inline-block;
	width: 250px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	line-height: 54px;
	outline: none;
}
.button-alfa::before,
.button-alfa::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-alfa,
.button-alfa::before,
.button-alfa::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button-alfa {
	background-color: rgba(0,0,0,0.6);  
	color: #FFFFFF;
	line-height: 50px;
}
.button-alfa:hover {
	background-color: rgba(0,0,0,0.3);  
	border-color: #333;
	color: #fff;
}
.button-alfa a:after {
    content: "\f105";
    font-family: FontAwesome;
    float:right;
padding-right:10px;
}

.c-cate1 #b1 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}

.c-cate2 #b2 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}

.c-cate3 #b3 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}

.c-cate4 #b4 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}

.c-cate5 #b5 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}

.c-cate6 #b6 .button-alfa{
	background-color: rgba(178,0,0,0.8); 
}


.contact-container {
    max-width: 640px;
    margin: 0 auto;
    box-sizing: border-box;
}


.button-contact {
	display: inline-block;
	width: 620px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	line-height: 54px;
	outline: none;
margin:20px 0;
}
.button-contact::before,
.button-contact::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button-contact,
.button-contact::before,
.button-contact::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button-contact {
	background-color: #EB611D;
	border: 2px solid #EB611D;
	color: #FFFFFF;
	line-height: 50px;
}
.button-contact:hover {
	background-color: #fff;
	border-color: #EB611D;
	color: #EB611D;
}



header #menu {
display:none;
}


.fixed #menu {
display:-webkit-box;
}

.fixed #menu2 {
display:-webkit-box;
}

#logo {
width:180px;
height:auto;
margin-top:25px;
}

#logo2 {
    width: 180px;
    height: auto;
    position: absolute;
    top: 5px;
    left: 20px;
}

.gnavi li {
float:left;
padding:0 20px;
margin-top:85px;
font-family: 'Lato', sans-serif;
font-weight:300;
font-size:19px;
border-right:1px solid #CCCCCC;
}

@media screen and (max-width: 1080px) {
.gnavi li {
float:left;
padding:0 3px;
margin-top:85px;
font-family: 'Lato', sans-serif;
font-weight:300;
font-size:18px;
border-right:1px solid #CCCCCC;
}

#snavi li {
    float: left;
    padding: 0 10px 0 0;
    font-size: 13px;
}

}


.gnavi li:first-child {

border-left:1px solid #CCCCCC;
}

#head .container {
padding:0;
}


.gnavi {
    float: right;
}

#snavi {
    position: absolute;
    top: 15px;
    right: 30px;
}

#snavi li {
float:left;
padding:0 20px 0 0;
font-family: 'Lato', sans-serif;
font-weight:300;
font-size:15px;
color:#666666;
}

#snavi li:last-child {
padding:0 0 0 0;
}

.ques {
    display: block;
    padding-left: 60px;
margin:20px 0 40px 0;
font-size:19px;
}
.ques:before {
    content: url(/common/images/faq/ico-q.png);
    display: block;
    float: left;
    margin-left: -60px;
margin-top:-7px;
    width: 60px;
    text-align: center;
}
.ans {
    display: block;
    padding-left: 60px;
margin:20px 0 40px 0;
font-size:15px;
}
.ans:before {
    content: url(/common/images/faq/ico-a.png);
    display: block;
    float: left;
    margin-left: -60px;
    width: 60px;
    text-align: center;
}

.blog a:before {
    content: "\f040";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.news a:before {
    content: "\f1ea";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.pin a:before {
    content: "\f231";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.ins a:before {
    content: "\f16d";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.fb a:before {
    content: "\f082";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.contact a:before {
    content: "\f003";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}

.faq a:before {
    content: "\f059";
    font-family: FontAwesome;
    margin: 10px;
    position: relative;
    top: 0;
 color:#666666;
}




#top-section-blog .flex{
margin-top:40px;
}

#top-section-blog h3 {
    font-weight: 700;
    height: 60px;
    line-height: 130%;
}

#top-section-blog p {
font-size:14px;
line-height:160%;
}

#top-section-blog .day {
padding-top:10px;
}

#top-section-blog img {
float:left;
padding-right:20px;
}
#top-section-blog {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 80px 0;
}





#blog .flex{
margin-top:40px;
}

#blog h3 {
    font-weight: 700;
    height: 60px;
    line-height: 130%;
}

#blog p {
font-size:14px;
line-height:160%;
}

#blog .day {
padding-top:10px;
}

#blog img {
float:left;
padding-right:20px;
}
#top-section-blog {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 80px 0;
}

#info-section {
  margin: 50px 0;
  padding: 0 100px;

line-height: 230%;
}






.contents_inner {
  box-sizing: boder-box;
  width: 100%;
  max-width: 1280px;
  height: 100%;
  margin: 0 auto;
  padding: 100px 10px 120px;
  color: #000;
  text-align: center;
}

.center {
text-align:center;
}

#bg-scale .col {
padding-left: 0; 
padding-right: 0; 
}

#concept {
    background: url(/common/images/about/concept-back.jpg) no-repeat top center;
    padding: 80px 0;
    font-size: 19px;
    line-height: 180%;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 100px;
}

#conceptbody .mainphoto {
padding-top:120px;
}

#conceptbody .col {

}

#conceptbody img {
width:100%;
height:auto;
}

#conceptbody h3 {
font-size:37px;
text-align:center;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
padding:50px 0 20px;
font-weight:normal;
border-bottom:initial;
}

#conceptbody h4 {
font-size:21px;
text-align:center;
font-weight:200;
padding:0 200px 50px 200px;
line-height:180%;
margin-top: 0px;
border-bottom:initial;
}

#conceptbody .about1box h4 {
padding:0 10px 50px 10px;
}

#conceptbody .about1box #sbt h4 {
padding:0 10px 10px 10px;
margin-bottom:0;
}


#conceptbody .maintext {
font-size:18px;
line-height:200%;
padding-top:50px;
}

#conceptbody .maintext2 {
font-size:18px;
line-height:240%;
padding-bottom:30px;
}


.section-blue1 {background-color:#C5C8CA; height:400px; width:100%; z-index:-1; position:absolute; top:220px;}
.section-blue3 {background-color:#C5C8CA; height:650px; width:100%; z-index:-1; position:absolute; top:220px;}
.section-blue2 {background-color:#C5C8CA;; height:740px; width:100%; z-index:-1; position:absolute; top:220px;}
.section-blue4 {background-color:#C5C8CA; height:700px; width:100%; z-index:-1; position:absolute; top:925px;}
.section-blue5 {background-color:#C5C8CA; height:630px; width:100%; z-index:-1; position:absolute; top:200px;}
.section-blue6 {background-color:#C5C8CA; height:630px; width:100%; z-index:-1; position:absolute; top:130px;}
#about-section h3 {
font-size:23px;
font-weight:700;
margin:10px 0 20px 0;
}

.bg-scale1{
    position: relative;
    overflow: hidden;
    text-align: center;
    color:#FFFFFF;
    padding: 100px 0;
}
.bg-scale1:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    background: url(/common/images/top/company-back.jpg) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.bg-scale1:hover:after {
    opacity: .8;
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.bg-scale1 .inner {
    z-index: 1;
    position: relative;
padding-left:100px;
    color: #FFFFFF;
    padding-top: 150px;
    padding-bottom: 150px;
}



.bg-scale2 {
    position: relative;
    overflow: hidden;
    text-align: center;
    color:#FFFFFF;
    padding: 100px 0;
}
.bg-scale2:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    background: url(/common/images/top/ric-back.jpg) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.bg-scale2:hover:after {
    opacity: .8;
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.bg-scale2 .inner {
    z-index: 1;
    position: relative;
    padding-left:100px;
    color: #FFFFFF;
    padding-top: 150px;
}



#info-section dl dt {
    float: left;
    width: 153px;
	position: relative;
	text-align: center;
}
#info-section dl dt span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 2.5em;
	padding: 0 1em;
	background-color: #fff;
	text-align: left;
}
#info-section dl dt::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background-color: #ccc;
}

.telbox {
float:left;
padding-right:20px;
}

.tel {
font-size:24px;
font-weight:900;
font-family: 'Lato', sans-serif;
}



#secondbox {
margin-bottom:70px;
}

.secondimg {
    width: 100%;
    height: 300px;
    display: block;
    color: #000000;
    padding-top: 100px;
}


#secondbox h2 {
font-size:23px;
padding:30px;
text-align:center;
font-weight:700;
background-color: rgba(255,255,255,0.2);  
border:2px solid #FFFFFF;
display:inline-block;
font-family: 'Oswald','游ゴシック', YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
color:#FFFFFF;
}

#secondbox h2 span {
display:block;
font-size:18px;
text-align:center;
font-weight:300;
}

#contact-section h2 {
font-size:19px;
margin-bottom:50px;
}

#contact-section .col {
padding-left:20px;
padding-right:20px;
}

.transparent{
text-align:center;
background-color: rgba(255,255,255,0.3);  
border:1px solid #FFFFFF;
padding:30px;
}

.transparent:hover{
background-color: rgba(255,255,255,0.5); 

}

.transparent h3 {
font-family: 'Lato', sans-serif;
font-size:27px;
font-weight:bold;
margin-bottom:20px;
}

.transparent h3 span {
display:block;
font-size:20px;
font-weight:normal;
}

.transparent h4 {
font-size:18px;
display:block;
}

.transparent h4:after {
    content: "\f144";
    font-family: FontAwesome;
    margin: 10px;
    display:block;
font-size:27px;
}


.second {
padding-top:10px;
}

.second h2 {
font-size:34px;
padding:30px;
text-align:center;
font-weight:500;
border-bottom:4px solid #000000;
display:inline-block;
    font-family: 'Oswald','游ゴシック', YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
}

.second h3 {
font-size:21px;
font-weight:900;
padding-bottom:20px;
}

#mission {
padding-bottom:100px;
}

#vision {
    background: url(/common/images/about/vission-back.jpg) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
border-top:1px solid #000000;
padding:140px 0 200px 0;
}
#service {
padding:50px 0 100px;
}

#service h3 {
font-size:19px;
font-weight:500;
padding-bottom:10px;
padding-top:10px;
}
#service img {
padding-top:50px;
padding-bottom:40px;
}

#service p {
font-size:15px;
padding-right:40px;
}



#case {
border-top:1px solid #333333;
margin-top:50px;
padding-top:50px;
margin-bottom:100px;
}

#case h2 {
font-size:28px;
padding:20px 0 0 0;
font-weight:700;
border-bottom: initial;
display:inline-block;
    font-family: 'Oswald','游ゴシック', YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;
    margin-bottom: 8px;
    margin-top: 0px;
text-align:left;
border-bottom:1px solid #555555;
padding-bottom:10px;
margin-bottom:30px;
width:100%;
}

#case h3 {
	padding: .25em 0 .25em .75em;
	border-left: 6px solid #EB611D;
margin-top:40px;
margin-bottom:20px;
}

#case p {
padding-bottom:10px;
padding-left:20px;
}

#case img {
width:100%;
height:auto;
display:block;
}

#case h2 span {
display:inline-block;
font-size:13px;
}

.yurai p {
padding-bottom:40px;
}


.right-text {
text-align:right;
padding-top:60px;
padding-bottom:30px;
}

#cp {
border-top:1px solid #666666;
border-bottom:1px solid #666666;
padding:100px;
margin-bottom:70px;
}


.greeting {
padding-top:100px 0;
}
.require{background-color:#c33;padding:1px 3px;color:#fafafa;font-size:13px;letter-spacing:1px;margin:0 0 0 10px;border-radius:3px;zoom:normal}
.any{background-color:#71b55b;padding:1px 3px;color:#fafafa;font-size:13px;letter-spacing:1px;margin:0 0 0 10px;border-radius:3px;zoom:normal}

.att{
	text-align: left;
	margin-bottom: 10px;
}

.clearfix:after {
  content: ".";  /* 譁ｰ縺励＞隕∫ｴ繧剃ｽ懊ｋ */
  display: block;  /* 繝悶Ο繝�け繝ｬ繝吶Ν隕∫ｴ縺ｫ */
  clear: both;
  height: 0;
  visibility: hidden;
}



#submit_button {
margin:auto;
text-align:center;
}

#submit_button input {
    background-color: #2EA5CF;
    width: 320px;
    padding: 15px 0;
    border: none;
    color: #FFFFFF;
    cursor: pointer;
    font-size: 18px;
}

#submit_button .back {
    background-color: #444444;
    width: 120px;
    padding: 15px 0;
    color: #FFFFFF;
    border: none;
    cursor: pointer;
    margin-left: 15px;
}


.bg-scale1 {
    position:relative;
    width:100%;
height:400px;
}

.bg-scale1 a {
position:absolute;
top:0;
left:0;
    width:100%;
    height:100%;

}

.bg-scale2 {
    position:relative;
    width:100%;
height:400px;
}

.bg-scale2 a {
position:absolute;
top:0;
left:0;
    width:100%;
    height:100%;

}

.local-navi {
background-color:#EEEEEE;
padding:15px 0;
margin:60px 0;
}

.local-navi ul {
	list-style-type: none;
	padding-left: 0;
}
.local-navi li {
	width: 80px;
	height: 20px;
	padding: 0 10px;
	margin: 0 10px;
}


.local-navi2 {
padding:15px 0;
margin:60px 0;
}

.local-navi2 a:link {
display:block;
}

.local-navi2 ul {
	list-style-type: none;
	padding-left: 0;
}
.local-navi2 li {
	width: 140px;
	padding: 10px;
	margin: 0 10px;
text-align:center;
background-color:#EEEEEE;
}

.inline-block {
	text-align: center;
}
.inline-block li {
	display: inline-block;
}
.table-cell {
	display: table;
	margin: auto;
}
.table-cell li {
	display: table-cell;
}
.clear {
  clear: both;
  display: block;
}

#top-section-blog .col,
#blog .col  {
margin-bottom:40px;
}

.c-text {
    padding: 20px 100px;

}

.white {
background-color:#FFFFFF;
}

.infobody {
background-color:#EEEEEE;
text-align:center;
padding:10px 15px;
margin-bottom:20px;
}

#blogmain {
background-color:#EEEEEE;
padding: 50px 0;
margin-top: 30px;
}

#blogmain h3 {
    font-size: 27px;
    padding: 15px 0 50px 0;
    font-weight: 700;
}

.right_content {
padding:15px;
}

.right_content h4 {
font-family: 'Lato', sans-serif;
font-size:20px;
font-weight:500;
margin-bottom:30px;
}

#contract h3 {
font-size:15px;
padding:20px 0 5px 0;
margin:0;
}

.blogcontents {
padding:20px 0;
border-top:1px dotted #AAAAAA;
border-bottom:1px dotted #AAAAAA;
margin-bottom:50px;
}

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

#contract {
margin-bottom:100px;
}

/*●個別記事のページナビ*/
.navigation {
  text-align: center;
  padding: 1em 0;
  width: 380px;
margin:0 auto;
}
.navitop {
  float:left;
  width:14%;
  text-align:center;
}
.navileft {
  float:left;
  width:43%;
  text-align:left;
  word-break:break-all;
  line-height:1.5em;
}
.naviright {
  float:right;
  width:43%;
  text-align:right;
  word-break:break-all;
  line-height:1.5em;
}





    .swiper-container {
        width: 100%;
        height: 700px;
        margin-left: auto;
        margin-right: auto;
    }

    .gallery-top {
        height: 80%;
        width: 100%;
    }
    .gallery-thumbs {
        height: 20%;
        box-sizing: border-box;
        padding: 10px 0;
    }
    .gallery-thumbs .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
    }
    .gallery-thumbs .swiper-slide-active {
        opacity: 1;
    }

#page-numbers {
margin:10px 0;
}

#page-numbers ul li {
float:left;
list-style:none;
}

#page-numbers a {
padding:5px 10px;
border:1px solid #555555;
font-size:13px;
margin-right:10px;
display: block;
float:left;
}

#page-numbers span {
padding:5px 10px;
border:1px solid #AAAAAA;
font-size:13px;
margin-right:10px;
display: block;
float:left;
}

/* カテゴリーカラー */

.Media {
color:#A46A65;
font-family: 'Lato', sans-serif;

font-size:15px;
}

.Press {
color:#618E94;
font-family: 'Lato', sans-serif;

font-size:15px;
}

.Recruit {
color:#D1806A;
font-family: 'Lato', sans-serif;

font-size:15px;
}

.eng-stl {
font-family: 'Lato', sans-serif;
font-size:26px;
font-weight:400;

}

.sinfo {
margin:50px 0;
font-size:15px;
line-height:190%;
}

.shopdata dl{
width: 100%;

}

.other-text strong {
font-family: "Noto Sans Japanese", 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
font-size:16px;
font-weight:700;
padding-bottom:5px;
margin-bottom:10px;
border-bottom:1px dotted #666666;
margin-top:30px;
display:block;
}

#report {
padding-bottom:20px;
}


.shopdata dt {
font-family: 'Lato', sans-serif;
font-size:16px;
font-weight:700;
line-height:190%;
display: block;
width: 20%;
clear: left;
float: left;
}

.shopdata dd{
display: block;
width: 80%;
line-height:190%;
font-size:16px;
float: left;
}
.tab{display:inline-block;}
.tab li{background:#C5C8CA; padding:10px 25px; float:left; margin-right:1px; font-size:18px;cursor:pointer; }

.content li{border:1px solid #DDDDDD; padding:20px;}
.hide {display:none;}

.tab li {
	position: relative;
	display: inline-block;
	padding: 0 15px;
	width: auto;
	min-width: 115px;
	height: 40px;
	color: #333333;
	line-height: 40px;
	text-align: center;
	background: #DDDDDD;
	z-index: 10;
}

.tab li.select {
	position: relative;
	display: inline-block;
	padding: 0 15px;
	width: auto;
	min-width: 115px;
	height: 40px;
	color: #F6F6F6;
	line-height: 40px;
	text-align: center;
	background: #19283C;
	z-index: 0;
}
.tab li.select:after {
	content: "";
	position: absolute;
	bottom: -10px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: #19283C transparent transparent transparent;
}



#s1 h2 {
font-size:26px;
text-align:left;
margin-bottom:20px;
font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
}

.tool h3 {
font-size:21px;
font-weight:500;
padding-bottom:5px;
}

.tool h4 {
font-size:18px;
font-weight:500;
}

.tool ol {
list-style-type: disc;
margin-left:30px;
}



#inline-wrap,#inline-wrap2,#inline-wrap3,#inline-wrap4,#inline-wrap5,#inline-wrap6,#inline-wrap7,#inline-wrap8{
background-color:#FFFFFF;
padding:20px;
}

/* WorkShop 追加 */
#WorkShop h3 {
	margin-top: 20px;
}
#WorkShop h3 span {
	background: #fff;
	padding: 20px 50px;
	color: #1a283b;
	font-size: 24px;
}
.ws_photo {
	margin: 0 auto;
	text-align: center;
}
.mab20 {
	margin-bottom: 20px;
}
.fcDeepblue {
	color: #1a283b;
}
.bold {
	font-weight: bold;
}
/* ↓画面幅481px以上（PC・タブレット）↓ */
@media all and (min-width: 481px) {
	.elmPC {
      	display: block;
	}
	.elmSP {
      	display: none;
	}
	.ws_photo img {
		display: block;
		float: left;
		margin: 5px;
	}
	#WorkShop #report .infobody {
		height: 12em;
	}
}
/* ↓画面幅480px以下（スマホ）↓ */
@media screen and (max-width: 480px) {
	.elmSP {
      	display: block;
	}
	.elmPC {
		display: none;
	}
	.ws_photo img {
		float: none;
		display: block;
		margin: 6px;
		max-width: 93%;
	}
	.ws_photo img.vertical {
		float: left;
		margin: 6px 0px 6px 6px;
		max-width: 43%;
	}
	#WorkShop #report .infobody {
		height: 14em;
	}
}