@charset "utf-8";

@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,700&subset=japanese"); html, body, header, footer, section, summary, article, aside, details, menu, nav, figcaption, figure, img, div, span, iframe, form, label,h1, h2, h3, h4, h5, h6, p, blockquote, pre, del, em, strong, mark, dl, dt, dd, ol, ul, li,table, caption, tbody, thead, tfoot, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline;}
header, footer, section, summary, article, aside, nav, figure, img {display:block;}
* {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
table {border-collapse:collapse; border-spacing:0;}
ul li {list-style:none;}
ol li {list-style:none;}
.clearfix:after {content:''; clear:both; display:block;}  html {width:100%; height:100%; font-size:62.5%;}
body {width:100%; height:100%;}
#wrap {position:relative; min-height:100% !important;}
#contents {padding-bottom:90px ;}
.display-sp {display:none !important;} body {
color:#000;
font-family:'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
font-size:1.4rem;
font-weight:300;
letter-spacing:0.08em;
} a {color:#60a80c; text-decoration:none; transition:all .3s;}
button {transition:all .3s;}  header {
position:relative;
height:120px;
padding-top:37px;
border-bottom:1px solid #d9d9d9;
}
header .logo {display:block; margin:auto; width:184px; height:30px;}
header .logo img {width:100%; }
header p {color:#777; font-size:1.1rem; text-align:center; margin-top:12px;} footer {
position:absolute;
left:0;
bottom:0;
width:100%;
height:90px;
background:#404040;
}
footer .logo {
position:absolute;
top:50%;
left:30px;
display:block;
height:21px;
transform:translateY(-50%);
}
footer .logo img {height:20px;}
footer p {
height:20px;
line-height:20px;
margin-top:38px;
margin-left:175px;
color:#fff;
font-size:1.1rem;
letter-spacing:0.1em;
}
footer .links {
position:absolute;
top:41px;
left:375px;
height:14px;
line-height:14px;
font-size:0;
border-left:1px solid #fff;
border-right:1px solid #fff;
}
footer .links li {display:inline-block; padding:0 12px;}
footer .links li + li {border-left:1px solid #fff;}
footer .links a {font-size:1.1rem; color:#fff;}
footer .links a:hover {color:#60a80c;} .breadcrumb {
padding:0 30px;
color:#999;
font-size:1.1rem;
border-bottom:1px solid #d9d9d9;
overflow-x:auto;
}
.breadcrumb ul {display:table;}
.breadcrumb li {display:table-cell; height:40px; white-space:nowrap; vertical-align:middle;}
.breadcrumb li + li:before {content:'»'; margin:0 10px;}
.breadcrumb li:last-child {padding-right:30px;}
.breadcrumb a {
position:relative;
display:inline-block;
height:20px;
line-height:20px;
}
.breadcrumb a:after {
content:'';
position:absolute;
bottom:-1px;
left:0;
width:100%;
height:1px;
background:#60a80c;
transform:scale(0, 1);
transform-origin:left top;
transition:all .3s;
}
.breadcrumb a:hover:after {
transform:scale(1, 1);
}
.breadcrumb a i {margin-right:3px;} .socialbtn a {
position:absolute;
display:block;
width:24px;
height:24px;
line-height:1.0;
}
.socialbtn i {
color:#60a80c;
font-size:2.4rem;
background:linear-gradient(to right bottom, #a4d643, #59960b);
background:-webkit-linear-gradient(left top, #a4d643, #59960b);
-webkit-background-clip:text;
-webkit-text-fill-color: rgba(255,255,255,0);
}
.socialbtn a:hover {transform:scale(1.2);}
.socialbtn .sb-fb {top:50%; right:80px; margin-top:-10px;}
.socialbtn .sb-tw {top:50%; right:40px; margin-top:-10px;} .searchform {position:absolute; top:50%; right:128px; margin-top:-12px;}
.searchform input[type=text] {
appearance:none;
width:170px;
height:30px;
margin-top:-2px;
padding:0 10px;
background:rgba(255, 255, 255, 0.2);
border:1px solid #ccc;
border-radius:2px;
}
.searchform input[type=submit] {display:none;}
.searchform input[type=submit] + label {
float:right;
display:block;
width:22px;
margin:3px 0 0 13px;
font-size:1.8rem;
opacity:0.7;
transition:all .3s;
cursor:pointer;
}
.searchform input[type=submit] + label:hover {opacity:1.0;}
header .searchform input[type=text]:hover {background:#f2f2f2;}
header .searchform input[type=text]:focus {background:#f2f2f2; outline:0;}
header .searchform i {color:#808080;}
header .searchform i {color:#555;}
footer .searchform input[type=text] {color:#fff;}
footer .searchform input[type=text]:hover {background:rgba(255, 255, 255, 0.1);}
footer .searchform input[type=text]:focus {background:rgba(255, 255, 255, 0.1); outline:0;}
footer .searchform i {color:#fff;} #btn-pagetop {
position:fixed;
bottom:20px;
right:52px;
width:40px;
height:40px;
font-size:0;
background:rgba(0, 0, 0, 0.3);
border:1px solid #fff;
border-radius:20px;
z-index:1000;
cursor:pointer;
}
#btn-pagetop:after {
content:'';
position:absolute;
top:50%;
left:50%;
display:block;
width:8px;
height:8px;
margin:-2px 0 0 -5px;
border-top:2px solid #fff;
border-right:2px solid #fff;
transform:rotate(-45deg);
}
#btn-pagetop:hover {background:rgba(0, 0, 0, 0.7);}
.errorpage + #btn-pagetop {display:none;} #ft-articles {
padding-top:50px;
background:#eee;
border-top:1px solid #d9d9d9;
box-shadow:0 1px 0 0 #fff inset;
}
#ft-articles .ft-articles-top {
margin-bottom:50px;
font-size:2.0rem;
font-weight:bold;
text-align:center;
letter-spacing:0.05em;
}
#ft-articles .ft-articles-top span {
display:block;
margin-top:8px;
color:#777;
font-size:1.3rem;
font-weight:normal;
} #ft-keywords {
padding:50px 10% 60px;
background:#eee;
border-top:1px solid #d9d9d9;
box-shadow:0 1px 0 0 #fff inset;
}
#ft-keywords dt {
position:relative;
height:14px;
line-height:14px;
margin-bottom:15px;
padding-left:10px;
font-size:1.3rem;
font-weight:bold;
border-left:5px solid #000;
}
#ft-keywords a {color:#000; font-size:1.2rem;}
#ft-keywords dd.category a {margin-right:20px;}
#ft-keywords dd.category a:before {content:'-'; margin-right:5px;}
#ft-keywords dd.category a:hover {color:#60a80c;}
#ft-keywords dd.keywords a {
display:inline-block;
height:20px;
line-height:20px;
margin:0 10px 12px 0;
padding:0 15px;
background:#fff;
border-radius:10px;
}
#ft-keywords dd.keywords span:before {content:'#';}
#ft-keywords dd.keywords a:hover {color:#fff; background:#60a80c; opacity:0.7;}
#ft-keywords dd + dt {margin-top:50px;} .list-articles {
display:flex;
flex-wrap:wrap;
justify-content:space-between;
padding:0 10%;
margin:auto;
}
.list-articles li {
position:relative;
flex-basis:30%;
margin-bottom:70px;
word-break:break-all;
} .list-articles li .listimg {
position:relative;
display:block;
width:100%;
margin-bottom:30px;
padding-top:66%;
filter:brightness(0.85);
border-radius:4px;
overflow:hidden;
}
.list-articles li .listimg:after {
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border-radius:4px;
box-shadow:0 0 30px rgba(0, 0, 0, 0.15) inset;
}
.list-articles li .listimg img {
position:absolute;
top:50%;
let:0;
transform:translateY(-50%);
width:100%;
height:auto;
}
.list-articles li .listimg:hover {filter:brightness(1.0);} .list-articles .listcont {
display:block;
margin-bottom:20px;
padding-right:13px;
color:#000;
font-size:1.3rem;
animation:all 0.2s;
}
.list-articles .listcont:hover {color:rgba(0,0,0,0.5);}
.list-articles .listcont:hover .title {text-decoration:underline;}
.list-articles .listcont .title {
margin-bottom:20px;
font-size:1.7rem;
font-weight:bold;
line-height:1.4;
} .list-articles .date {color:#777; font-size:1.1rem; margin-bottom:3px;}
.list-articles .tags a {display:inline; font-size:1.2rem; margin-right:10px;}
.list-articles .tags a:hover {text-decoration:underline;}
.list-articles .tags a:before {content:'#';}
.listcategory {
display:inline-block;
margin-top:13px;
margin-right:20px;
padding:3px 15px;
color:#fff;
font-size:1.1rem;
background:#595959;
opacity:0.7;
}
.listcategory i {margin-right:10px;}
.listcategory:hover {opacity:1.0;} .list-articles li:nth-child(3n+2):last-child {margin-right:35%;} .noarticles {
flex-basis:100%;
display:block;
text-align:center;
} .list-articles.pickup {border-bottom:1px solid #d9d9d9;}
.list-articles.pickup li:before {
content:'CHECK';
position:absolute;
top:-15px;
right:-15px;
display:block;
width:60px;
height:60px;
line-height:61px;
color:#fff;
font-size:1.2rem;
font-weight:bold;
text-align:center;
background:#ffa415;
border-radius:50%;
transform:rotate(25deg);
z-index:100;
} .list-articles li.new:before {
content:'NEW';
position:absolute;
top:-15px;
right:-15px;
display:block;
width:60px;
height:60px;
line-height:61px;
color:#fff;
font-size:1.2rem;
font-weight:bold;
text-align:center;
background:#8cbe28;
border-radius:50%;
transform:rotate(25deg);
z-index:100;
}  .btn-more{
position:relative;
display:block;
width:35%;
height:55px;
line-height:55px;
margin:50px auto 100px;
color:#000;
font-size:1.3rem;
font-weight:bold;
letter-spacing:0.2em;
text-align:center;
background:none;
border:1px solid #333;
border-radius:3px;
text-transform:uppercase;
-webkit-transition:all .3s;
transition:all .3s;
}
.btn-more:hover {
color:#fff;
}
.btn-more:after{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:0;
background:rgba(0, 0, 0, 0.7);
z-index:-1;
-webkit-transition: all .3s;
transition: all .3s;
}
.btn-more:hover:after {
top:0;
left:0;
width:100%;
height:100%;
} .pager {text-align:center;}
.pager a {
display:inline-block;
margin:50px auto 80px;
padding:10px 25px;
color:#333;
font-size:1.2rem;
border:1px solid #ccc;
border-radius:2px;
}
.pager a:hover {
background:#595959;
color:#fff;
border:1px solid #595959;
}
.pager span {
display:inline-block;
padding:10px;
color:#333;
font-size:1.2rem;
font-weight:bold;
}
.toppage .pager {display:none !important;}
.singlepage .pager {display:none !important;}  .toppage h2 {
margin:70px auto 50px;
font-size:2.3rem;
font-weight:bold;
text-align:center;
letter-spacing:0.05em;
}
.toppage h2 span {
display:block;
margin-top:8px;
color:#777;
font-size:1.3rem;
font-weight:normal;
} .topimg {position:relative;}
.topimg img {width:100%;}
.topimg p {
position:absolute;
top:65px;
width:100%;
font-size:1.7rem;
font-weight:bold;
letter-spacing:0.1em;
line-height:1.9;
text-align:center;
text-shadow:
2px 2px 0 #fff,
2px -2px 0 #fff,
-2px 2px 0 #fff,
-2px -2px 0 #fff;
z-index:100;
}  .singlepage {position:relative;}
.singlepage.pickup:before {
content:'CHECK';
position:absolute;
top:450px;
right:50%;
margin-right:-520px;
display:block;
width:100px;
height:100px;
line-height:101px;
color:#fff;
font-weight:bold;
text-align:center;
background:#ffa415;
border-radius:50%;
transform:rotate(25deg);
z-index:100;
}
.singlepage.new:before {
content:'NEW';
position:absolute;
top:450px;
right:50%;
margin-right:-520px;
display:block;
width:100px;
height:100px;
line-height:101px;
color:#fff;
font-weight:bold;
text-align:center;
background:#8cbe28;
border-radius:50%;
transform:rotate(25deg);
z-index:100;
} .singlepage h1 {
margin:0 auto 20px;
font-size:3.0rem;
letter-spacing:0.1em;
}
.singlepage h2 {
position:relative;
margin-bottom:80px;
padding-top:120px;
font-size:2.5rem;
letter-spacing:0.1em;
}
.singlepage h2:before {
content:'';
position:absolute;
top:50px;
left:50%;
transform:translateX(-50%);
display:block;
width:100vw;
height:1px;
background:#d9d9d9;
}
.singlepage h2:after {
content:'';
position:absolute;
left:0;
bottom:-25px;
width:130px;
height:2px;
background:#000;
}
#ez-toc-container + h2 {padding-top:80px;}
#ez-toc-container + h2:before {display:none;}
.singlepage h3 {
margin:60px -30px 40px;
padding:10px 30px;
font-size:1.8rem;
background:#ebebeb;
}
.singlepage h4 {
margin:50px 0 40px;
font-size:1.7rem;
} .mainimg {
position:relative;
background:#272825;
height:500px;
margin-bottom:70px;
border-bottom:1px solid #d9d9d9;
overflow:hidden;
}
.mainimg img {
position:absolute;
width:960px;
height:auto;
top:50%;
left:50%;
transform:translate(-50%, -50%);
} .singlepage {font-size:1.6rem; letter-spacing:0.1em;}
.singlepage .inner {width:780px; margin:auto;}
.singlepage .tags a {display:inline; font-size:1.3rem; margin-right:15px;}
.singlepage .tags a:before {content:'#';}
.singlepage .tags a:hover {text-decoration:underline;}
.singlepage .entry-header {width:780px; margin:auto;}
.singlepage .entry-header .date {margin-bottom:20px; color:#999; font-size:1.3rem;}
.singlepage .entry-header .summary {line-height:1.8;}
.singlepage .entry-header .tags {margin-top:30px;}
.singlepage .entry-footer {
width:780px;
margin:20px auto 100px;
padding:30px 40px;
font-size:1.4rem;
border:1px solid #d9d9d9;
}
.singlepage .entry-footer i {margin-right: 4px;}
.singlepage .entry-footer .date {display:inline-block; margin:0 20px 0 0; color:#000;}
.singlepage .entry-footer .author {display:inline-block;}
.singlepage .entry-footer .tags {margin:8px 0 15px;}
.singlepage section {padding-bottom:30px;}
.singlepage section p {margin-bottom:30px; line-height:1.6;}
.singlepage section em {font-style:normal; font-weight:bold;}
.singlepage section a:hover {text-decoration:underline;}
.singlepage section table {border:1px solid #ccc; margin:60px 0; font-size:1.5rem;}
.singlepage section table th {border:1px solid #ccc; background:#ede6df; padding:15px 30px; text-align:left; box-shadow:0 0 0 1px #fff inset;}
.singlepage section table td {border:1px solid #ccc; padding:15px 30px;}
.singlepage section ol {margin-bottom:40px;}
.singlepage section ul {margin-bottom:40px;}
.singlepage section ol li {
list-style:decimal;
list-style-position:inside;
margin-bottom:30px;
padding-left:20px;
text-indent:-20px;
}
.singlepage section ul li {
list-style:square;
list-style-position:inside;
margin-bottom:10px;
}
.singlepage section blockquote {
margin:60px 0;
padding:30px 35px 15px;
font-size:1.4rem;
border-left:4px solid #e5e5e5;
background:#f5f5f5;
}
.singlepage section blockquote p {margin-bottom:20px;}
.singlepage section img {
width:70%;
height:auto;
margin:60px auto;
border:4px solid #fff;
border-radius:2px;
box-shadow:0 0 0 1px #d9d9d9;
}
.singlepage section .img-caption {
margin-top:-35px;
margin-bottom:60px;
color:#999;
font-size:1.2rem;
text-align:center;
} #ez-toc-container {
position:relative;
left:50%;
transform:translateX(-50%);
width:100vw;
background:#f5f5f5;
border-top:1px solid #d9d9d9;
border-bottom:1px solid #d9d9d9;
box-shadow:0 1px 0 0 #fff inset, 0 -1px 0 0 #fff inset;
margin-top:70px;
padding:30px 50px 15px;
}
#ez-toc-container .ez-toc-title {
width:780px;
margin:0 auto 20px;
font-size:1.9rem;
font-weight:bold;
}
#ez-toc-container nav {
width:780px;
margin:auto;
}
#ez-toc-container ul {counter-reset:cnt;}
#ez-toc-container ul.ez-toc-list ul {counter-reset:cnt;}
#ez-toc-container ul.ez-toc-list li:before {content:counters(cnt, '-'); counter-increment:cnt;}
#ez-toc-container ul li {list-style:none;}
#ez-toc-container ul.ez-toc-list li a {color:#124466; font-weight: bold;}
#ez-toc-container ul.ez-toc-list li a:hover {opacity:0.7; text-decoration:underline;} #ez-toc-container ul.ez-toc-list > li {
position:relative;
line-height:1.3;
margin-bottom:30px;
padding-left:45px;
font-size:1.5rem;
}
#ez-toc-container ul.ez-toc-list > li:before {
position:absolute;
left:0px;
padding:2px 13px;
color:#fff;
font-size:1.2rem;
font-weight:bold;
text-align:center;
border-radius:2px;
background:#124466;
} #ez-toc-container ul.ez-toc-list ul li {
position:relative;
margin:10px 0 0 -25px;
padding-left:35px;
color:#124466;
font-size:1.3rem;
font-weight:bold;
}
#ez-toc-container ul.ez-toc-list ul li:before {
position:absolute;
left:0px;
}  .archives h1 {
margin:70px auto 50px;
font-size:2.3rem;
font-weight:bold;
text-align:center;
letter-spacing:0.05em;
}
.archives h1 span {
display:block;
margin-top:8px;
color:#777;
font-size:1.3rem;
font-weight:normal;
}  .company h1 {
margin:70px auto 50px;
font-size:2.3rem;
font-weight:bold;
text-align:center;
letter-spacing:0.05em;
}
.company h1 span {
display:block;
margin-top:8px;
color:#777;
font-size:1.3rem;
font-weight:normal;
}
.company h2 {
height:auto;
margin-bottom:50px;
padding:0 30px 15px;
color:#60a80c;
font-size:1.6rem;
letter-spacing:0.15em;
background:initial;
border-bottom:1px solid #ccc;
border-radius:0;
} .company section {
width:600px;
margin:0 auto 100px;
font-size:1.4rem;
}
.company dl {
padding:0 10px 0 30px;
}
.company dt {
float:left;
clear:both;
margin-bottom:25px;
width:120px;
color:#999;
font-size:1.3rem;
font-weight:bold;
}
.company dd {
margin-left:120px;
margin-bottom:25px;
}
.company .link-corp {text-align:center; margin:100px auto;}
.company .link-corp a {
position:relative;
display:block;
width:330px;
height:60px;
line-height:62px;
margin:30px auto;
color:#000;
font-size:1.3rem;
border:1px solid #333;
border-radius:3px;
}
.company .link-corp a span {
position:relative;
height:14px;
line-height:14px;
padding-right:15px;
}
.company .link-corp a span:after {
content:'';
position:absolute;
top:50%;
right:0;
display:block;
width:6px;
height:6px;
margin-top:-4px;
border-top:1px solid #000;
border-right:1px solid #000;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
}
.company .link-corp a:hover {color:#fff; opacity:1.0; background:#333; text-decoration:none;}
.company .link-corp a:hover span:after {border-top:1px solid #fff; border-right:1px solid #fff;} .errorpage {text-align:center;}
.errorpage h1 {
margin-bottom:40px;
font-size:2.5rem;
font-weight:bold;
letter-spacing:0.1em;
}
.errorpage img {width:90px; height:auto; margin:50px auto 40px;}
.errorpage p {font-size:1.3rem; letter-spacing:0.1em; line-height:1.7; margin-bottom:50px;}
.errorpage a {
display:inline-block;
width:140px;
height:40px;
margin-bottom:80px;
line-height:38px;
color:#fff;
text-align:center;
background:#60a80c;
border:2px solid #60a80c;
}
.errorpage a:hover {color:#60a80c; background:#fff; border:2px solid #60a80c;}
.errorpage a + a {margin-left:35px;} @media screen and (max-width:1100px) { .singlepage.pickup:before {right:30px; margin-right:0;}
.singlepage.new:before {right:30px; margin-right:0;}
}
@media screen and (max-width:960px) { header .logo {margin:0 0 0 30px;}
header p {text-align:left; margin-left:30px; margin-top:8px;} footer:before {
content:'';
position:absolute;
top:-40px;
left:0;
display:block;
width:100%;
height:40px;
background:#404040;
border-bottom:1px solid #303030;
box-shadow:0 1px 0 0 #5a5a5a;
}
footer .links {
top:-25px;
left:50%;
transform:translateX(-50%);
} .list-articles li {position:relative; flex-basis:45%; margin-bottom:90px;}
.list-articles li:nth-child(3n+2):last-child {margin-right:auto;} .singlepage h1 {font-size:2.7rem;}
.singlepage h2 {font-size:2.2rem;}
.singlepage h3 {margin:60px 0 40px;} .singlepage.pickup:before {top:340px; right:30px; margin-right:0;}
.singlepage.new:before {top:340px; right:30px; margin-right:0;} .mainimg {height:400px;} .singlepage {font-size:1.5rem; letter-spacing:0.1em;}
.singlepage .inner {width:100%; padding:0 35px;}
.singlepage .entry-header {width:100%; padding:0 35px;}
.singlepage .entry-footer {width:calc(100% - 70px);}
#ez-toc-container .ez-toc-title {width:100%;}
#ez-toc-container nav {width:100%;}
}