@charset "utf-8";

@import url("top.css");
@import url("company.css");
@import url("business.css");
@import url("business02_01_221128.css");
@import url("sustainability.css");
@import url("recruit.css");
@import url("policy.css");
@import url("contact.css");
@import url("news.css");
@import url("release.css");
@import url("navi.css");
@import url("slide.css");

/* ----------------------------------------------------------------
Reset
----------------------------------------------------------------- */

body,div,dl,dt,dd,ul,li,h1,h2,h3,h4,h5,h6,p,a { margin: 0; padding: 0; }
img { border: 0; }
li,dt,dd { list-style: none; }

/* ----------------------------------------------------------------
Common
----------------------------------------------------------------- */

html {
font-size: 62.5%;
}

body {
text-align: center;
color: #111;
background: #fff;
font-family: 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-size: 1.5rem;
line-height: 3rem;
margin: 0 auto;
}

.clear { width:100%; }
.clear:after {
content: ""; 
display: block; 
clear: both;
}

.tac { text-align: center!important; }
.tal { text-align: left!important; }
.tar { text-align: right!important; }

.mgt-5 { margin-top: -5px!important; }
.mgt-10 { margin-top: -10px!important; }
.mgt-20 { margin-top: -20px!important; }

.mgb10 { margin-bottom: 10px!important; }
.mgb20 { margin-bottom: 20px!important; }
.mgb30 { margin-bottom: 30px!important; }
.mgb40 { margin-bottom: 40px!important; }
.mgb50 { margin-bottom: 50px!important; }
.mgb60 { margin-bottom: 60px!important; }
.mgb70 { margin-bottom: 70px!important; }
.mgb80 { margin-bottom: 80px!important; }
.mgb90 { margin-bottom: 90px!important; }
.mgb100 { margin-bottom: 100px!important; }

.fs10 { font-size: 1rem; }
.fs11 { font-size: 1.1rem!important; }
.fs12 { font-size: 1.2rem!important; }
.fs13 { font-size: 1.3rem!important; }
.fs14 { font-size: 1.4rem!important; }
.fs15 { font-size: 1.5rem!important; }
.fs16 { font-size: 1.6rem!important; }
.fs17 { font-size: 1.7rem!important; }
.fs18 { font-size: 1.8rem!important; }
.fs19 { font-size: 1.9rem!important; }
.fs20 { font-size: 2rem!important; }
.fs21 { font-size: 2.1rem!important; }
.fs22 { font-size: 2.2rem!important; }
.fs23 { font-size: 2.3rem!important; }
.fs24 { font-size: 2.4rem!important; }
.fs25 { font-size: 2.5rem!important; }

.sponly { display: none; }


/* ----------------------------------------------------------------
Header
----------------------------------------------------------------- */

#header {
z-index: 10;
position: absolute;
top: 0;
width: 100%;
height: 55px;
background: #fff;
border-top: 4px solid #71b4de;
border-bottom: 1px solid #dedede;
margin: 0;
}
#header.top {
height: 96px;
}

#header .inner {
width: calc(100% - 100px);
height: 55px;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: center;
align-items: center;
margin: 0 auto;
}

#header.top .inner {
height: 96px;
}

#header #logo {
padding: 12px 0 0 0;
}

#header nav ul#mainnav {
height: 55px;
display: -webkit-flex;
display: flex;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
margin: 0 -13px 0 auto;
}
#header.top nav ul#mainnav {
height: 96px;
}

#header nav ul#mainnav li {
min-width: 96px;
margin-top: -1px;
}

#header nav li {
font-size: 1.65rem;
line-height: 2.4rem;
letter-spacing: 0.05rem;
}

#header nav li a.parent {
display: block;
height: 55px;
font-weight: bold;
text-decoration: none;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
padding: 0 13px 0 13px;
}
#header.top nav li a.parent {
height: 96px;
}
#header.top.fixed nav li a.parent {
height: 55px;
}

#header nav li a.parent:link, #header nav li a.parent:visited {
color: #000;
text-decoration: none;
}

#header nav li a.parent:hover, #header nav li a.parent:active {
color: #777;
text-decoration: none;
}

#header nav li.current a.parent:link, #header nav li.current a.parent:visited {
color: #000;
text-decoration: none;
}

#header nav li.current a.parent:hover, #header nav li.current a.parent:active {
color: #777;
text-decoration: none;
}

/* ----------------------------------------------------------------
Header Fixed
----------------------------------------------------------------- */

#header.fixed {
position: fixed;
top: 0;
left: 0;
z-index: 10;
width: 100%;
height: 66px;
background: #fff;
border-top: none;
animation: appear 0.4s;
}

#header.top.fixed {
position: fixed;
top: 0;
left: 0;
z-index: 10;
width: 100%;
height: 55px;
background: #fff;
border-top: none;
animation: appear 0.4s;
}

@keyframes appear {
0% { height: 66px; margin-top: -66px; }
100% { height: 55px; margin-top: 0; }
}

#header.fixed .inner {
height: 55px;
}

/* ----------------------------------------------------------------
Subnav
----------------------------------------------------------------- */

.subnav {
text-align: left;
}

#header .subnav h3 a:link, #header .subnav h3 a:visited {
color: #eee;
text-decoration: none;
}
#header .subnav h3 a:hover, #header .subnav h3 a:active {
color: #bbb;
text-decoration: none;
}
#header .subnav h4 a:link, #header .subnav h4 a:visited {
color: #eee;
text-decoration: none;
}
#header .subnav h4 a:hover, #header .subnav h4 a:active {
color: #bbb;
text-decoration: none;
}
#header .subnav li a:link, #header .subnav li a:visited {
color: #ddd;
text-decoration: none;
}
#header .subnav li a:hover, #header .subnav li a:active {
color: #bbb;
text-decoration: none;
}

.subnav .wrap {
display: block;
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
margin: 0 auto;
padding: 0;
}

.subnav h3 {
color: #eee;
font-size: 2.8rem;
line-height: 2.8rem;
letter-spacing: 0.2rem;
margin: 0;
padding: 0;
}

.subnav h3 a {
display: block;
background: url(/image/arrow_right.png) no-repeat 0 52%;
padding: 0 0 0 18px;
}

.subnav h4 {
color: #eee;
font-size: 1.6rem;
line-height: 2.4rem;
margin: 0 0 12px 0;
padding: 0;
}

.subnav h4 a {
display: block;
background: url(/image/arrow_right.png) no-repeat 0 9px;
padding: 0 0 0 15px;
}

#header .subnav ul {
margin: 0;
padding: 0;
}

#header nav li .subnav li {
position: relative;
color: #fff;
font-size: 1.4rem;
line-height: 2rem;
margin: 0 0 10px 18px;
padding: 0;
}

#header nav li .subnav li::before {
position: absolute;
top: 1rem;
left: -15px;
content: "";
display: inline-block;
width: 8px;
height: 1px;
background: #ccc;
}

#subnav1 {
display: none;
position: absolute;
top: 55px;
left: 0;
z-index: 10;
width: 100%;
background: #222;
padding: 25px 0;
}
#nav1:hover #subnav1 {
display: block;
}
#header.fixed #nav1:hover #subnav1 {
top: 55px;
}
#header.top #nav1:hover #subnav1 {
top: 96px;
}
#header.top.fixed #nav1:hover #subnav1 {
top: 55px;
}

#subnav2 {
display: none;
position: absolute;
top: 55px;
left: 0;
z-index: 10;
width: 100%;
background: #222;
padding: 25px 0;
}
#nav2:hover #subnav2 {
display: block;
}
#header.fixed #nav2:hover #subnav2 {
top: 55px;
}
#header.top #nav2:hover #subnav2 {
top: 96px;
}
#header.top.fixed #nav2:hover #subnav2 {
top: 55px;
}

#subnav3 {
display: none;
position: absolute;
top: 55px;
left: 0;
z-index: 10;
width: 100%;
background: #222;
padding: 25px 0;
}
#nav3:hover #subnav3 {
display: block;
}
#header.fixed #nav3:hover #subnav3 {
top: 55px;
}
#header.top #nav3:hover #subnav3 {
top: 96px;
}
#header.top.fixed #nav3:hover #subnav3 {
top: 55px;
}

#subnav4 {
display: none;
position: absolute;
top: 55px;
left: 0;
z-index: 10;
width: 100%;
background: #222;
padding: 25px 0;
}
#nav4:hover #subnav4 {
display: block;
}
#header.fixed #nav4:hover #subnav4 {
top: 55px;
}
#header.top #nav4:hover #subnav4 {
top: 96px;
}
#header.top.fixed #nav4:hover #subnav4 {
top: 55px;
}

.subnav .column {
text-align: left;
max-width: 300px;
border-left: 1px solid #454545;
margin: 0 30px 0 0;
padding: 10px 0 0 30px;
}

.subnav .column:first-of-type {
text-align: right;
border-left: none;
margin: 0 0 0 0;
padding: 8px 30px 0 0;
}

.subnav .column:last-of-type {
margin: 0;
}

/* ----------------------------------------------------------------
Sitepath
----------------------------------------------------------------- */

#sitepath {
position: relative;
width: 100%;
z-index: 9;
background: #fff;
border-top: 1px solid #dedede;
border-bottom: 1px solid #dedede;
}

#sitepath nav ol {
width: 1200px;
height: 36px;
text-align: left;
margin: 0 auto;
padding: 0;
}

#sitepath nav ol {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}

#sitepath nav li {
color: #666;
font-size: 1.2rem;
}

#sitepath nav li:first-child {
background: url(/image/icon_home.png) no-repeat 0 50%;
background-size: 14px 14px;
padding-left: 20px;
}

#sitepath nav li::after {
content: '/';
display: inline-block;
color: #ccc;
padding: 0 10px;
}

#sitepath nav li:last-child::after {
display: none;
}

#sitepath nav li a:link,
#sitepath nav li a:visited {
color: #777;
text-decoration: none;
cursor: pointer;
}

#sitepath nav li a:active,
#sitepath nav li a:hover {
color: #999;
text-decoration: none;
cursor: pointer;
}

/* ----------------------------------------------------------------
Mainvisual
----------------------------------------------------------------- */

#mv-image {
position: relative;
width: 100%;
height: 400px;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
background: url(/image/mv_common.jpg) no-repeat 0 50%;
background-size: cover;
z-index: 1;
margin-top: 97px;
}

#mv-image::after {
content: '';
background-color: rgba(0,0,0,.3);
position: absolute;
z-index: 2;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

#mv-image .text {
width: 1200px;
text-align: left;
z-index: 3;
margin: 0 auto;
}

#mv-image .text h1 {
color: #fff;
font-size: 3.6rem;
line-height: 3.6rem;
letter-spacing: 0.4rem;
padding-top: 10px;
margin-bottom: 10px;
}

#mv-image .text p {
width: 700px;
color: #fff;
font-size: 1.6rem;
line-height: 2.8rem;
margin: 0 0 15px 0;
}

#mv-image .text p:first-of-type {
padding-top: 15px;
}

#mv-text {
width: 100%;
height: 150px;
text-align: left;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
border-bottom: 1px solid #dedede;
margin: 97px 0 60px 0;
}

#mv-text .text {
width: 1200px;
text-align: left;
margin: 0 auto;
}

#mv-text h1 {
font-size: 3.6rem;
letter-spacing: 0.4rem;
margin: -2px 0 0 0;
}

/* ----------------------------------------------------------------
Submenu
----------------------------------------------------------------- */

#submenu {
position: absolute;
width: 100%;
background: #222;
margin: 0;
}

#submenu.fixed {
position: fixed;
top: 93px;
z-index: 5;
}

#submenu ul {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
margin: 0 auto;
}

#submenu li {
min-width: 40px;
font-size: 1.4rem;
line-height: 1.8rem;
letter-spacing: 0.05rem;
font-weight: bold;
margin: 0 15px;
padding: 12px 0 7px 0;
}

#submenu.fixed li {
padding: 11px 0 6px 0;
}

#submenu li a {
display: block;
padding: 0 0 4px 0;
cursor: pointer;
}

#submenu li a:link, #submenu li a:visited {
color: #bbb;
text-decoration: none;
border-bottom: 2px solid #222;
cursor: pointer;
}

#submenu li a:hover, #submenu li a:active {
color: #fff;
border-bottom: 2px solid #fff;
cursor: pointer;
}

#submenu li.current a:link, #submenu li.current a:visited {
color: #fff;
border-bottom: 2px solid #fff;
cursor: pointer;
}

#submenu li.current a:hover, #submenu li.current a:active {
color: #fff;
border-bottom: 2px solid #fff;
cursor: pointer;
}

/* ----------------------------------------------------------------
Pagetop
----------------------------------------------------------------- */

#pagetop {
width: 50px;
height: 50px;
line-height: 46px;
position: fixed;
z-index: 5;
right: 20px;
bottom: 20px;
text-align: center;
}

#pagetop a {
position: relative;
display: block;
width: 50px;
height: 50px;
background: #222;
border-radius: 50%;
}

#pagetop a:hover {
background: #555;
}

#pagetop img {
}

/* ----------------------------------------------------------------
Footer Banner
----------------------------------------------------------------- */

#footer-banner {
width: 100%;
height: 280px;
margin: 0 auto;
}

#footer-banner ul {
width: 100%;
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}

#footer-banner li {
position: relative;
overflow: hidden;
height: 100%;
font-weight: bold;
}

#footer-banner li#footer-banner-company {
width: 33%;
}
#footer-banner li#footer-banner-business {
width: 34%;
}
#footer-banner li#footer-banner-sustainability {
width: 33%;
}

#footer-banner li::before {
content: '';
background-color: rgba(0,0,0,.5);
position: absolute;
z-index: 2;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

#footer-banner li::after {
position: absolute;
content: "";
display: block;
width: 100%;
height: 100%;
top: 0;
background-size: cover;
transition: all .3s ease-out;
}

#footer-banner li#footer-banner-company::after {
background: url(/image/footerbanner01.jpg) no-repeat 50% 50%;
background-size: cover;
}

#footer-banner li#footer-banner-business::after {
background: url(/image/footerbanner02.jpg) no-repeat 50% 90%;
background-size: cover;
}

#footer-banner li#footer-banner-sustainability::after {
background: url(/image/footerbanner03.jpg) no-repeat 50% 15%;
background-size: cover;
}

#footer-banner li#footer-banner-recruit {
display: none;
}

#footer-banner li#footer-banner-top {
display: none;
}

#footer-banner li:hover::after {
opacity: .8;
transform: scale(1.05);
}

#footer-banner li a {
position: relative;
z-index: 3;
height: 100%;
width: 100%;
color: #eee;
text-decoration: none;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}

#footer-banner li p.en {
font-size: 1.4rem;
letter-spacing: 0.2rem;
font-family: 'Helvetica Neue','Helvetica','Archivo Narrow', sans-serif;
font-weight: 500;
}

#footer-banner li p.ja {
font-size: 2.2rem;
letter-spacing: 0.6rem;
font-weight: 600;
margin-bottom: 5px;
}

#footer-banner li#footer-banner-sustainability p.ja {
letter-spacing: 0.4rem;
}

/* ----------------------------------------------------------------
Footer
----------------------------------------------------------------- */

#footer {
width: 100%;
background: #fafafa;
margin: 0;
padding: 0;
}

#footer .inner {
width: 90%;
text-align: left;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
margin: 0 auto;
padding: 50px 0 40px 0;
}

#footer .inner #footer-info {
min-width: 230px;
box-sizing: border-box;
padding-right: 30px;
margin: 0 0 30px 0;
}

#footer-info h2 {
font-size: 1.6rem;
line-height: 1.6rem;
letter-spacing: 0.1rem;
margin: 0 0 15px 0;
padding: 0;
}

#footer-info p {
font-size: 1.4rem;
line-height: 2.2rem;
margin: 0 0 20px 0;
}

#footer-info .privacymark img {
width: 80px;
}

#footer .inner #footer-link {
display: -webkit-flex;
display: flex;
}

#footer-link .column1 {
min-width: 214px;
box-sizing: border-box;
border-left: 1px solid #eae5e3;
border-right: 1px solid #eae5e3;
padding: 0 45px 0 40px;
}

#footer-link .column2 {
min-width: 290px;
box-sizing: border-box;
border-right: 1px solid #eae5e3;
padding: 0 45px 0 40px;
}

#footer-link .column3 {
min-width: 270px;
box-sizing: border-box;
border-right: 1px solid #eae5e3;
padding: 0 45px 0 40px;
}

#footer-link a:link, #footer-link a:visited {
color: #2c2c2c;
text-decoration: none;
}

#footer-link a:hover, #footer-link a:active {
color: #777;
text-decoration: none;
}

#footer-link h3 {
font-size: 1.6rem;
line-height: 1.6rem;
letter-spacing: 0.05rem;
margin: 0 0 15px 0;
background: url(/image/arrow_right_black.png) no-repeat 0 58%;
padding: 0 0 0 13px;
}

#footer-link .column1 h3:nth-of-type(1),
#footer-link .column1 h3:nth-of-type(3) {
margin: 0 0 40px 0;
}

#footer-link li {
font-size: 1.4rem;
line-height: 1.4rem;
margin: 0 0 13px 0;
padding: 0 0 0 13px;
}

#footer-link li ul li {
position: relative;
margin: 0 0 13px 0;
padding: 0;
}

#footer-link li ul li::before {
position: absolute;
top: 50%;
left: -15px;
content: "";
display: inline-block;
width: 8px;
height: 1px;
background: #aaa;
}

#footer-link .column1 ul {
margin-bottom: 40px;
}
#footer-link .column1 li ul {
margin: 6px 0 10px 15px;
}

#footer-link .column2 ul {
margin-bottom: 0;
}
#footer-link .column2 li ul {
margin: 13px 0 25px 16px;
}

#footer-link .column3 ul {
margin-bottom: 50px;
}
#footer-link .column3 li ul {
margin: 13px 0 15px 16px;
}

/* ----------------------------------------------------------------
Footer Copyright
----------------------------------------------------------------- */

#footer-copyright {
width: 100%;
text-align: center;
color: #eee;
margin: 0 auto;
background: #222;
padding: 30px 0 30px 0;
}

#footer-copyright li a:link, #footer-copyright li a:visited {
color: #eee;
text-decoration: none;
}

#footer-copyright li a:hover, #footer-copyright li  a:active {
color: #bbb;
text-decoration: none;
}

#footer-copyright ul {
width: 1000px;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: center;
justify-content: center;
margin: 0 auto 0 auto;
padding: 0;
}

#footer-copyright li {
font-size: 1.2rem;
line-height: 1.3rem;
margin: 0 0 20px 0;
padding: 0 0 0 0;
}

#footer-copyright li::after {
content: '|';
display: inline-block;
font-size: 1.1rem;
color: #555;
padding: 0 15px;
}

#footer-copyright li:nth-of-type(5)::after {
content: '';
padding: 0;
}

#footer-copyright li:nth-of-type(8)::after {
content: '';
padding: 0;
}

#footer-copyright p {
color: #999;
font-size: 1.1rem;
font-family: Montserrat,"Helvetica Neue",sans-serif;
letter-spacing: 0.1rem;
}

/* ----------------------------------------------------------------
Main
----------------------------------------------------------------- */

#main {
width: 1200px;
text-align: left;
margin: 0 auto 60px auto;
padding-top: 105px;
}

#main .inpagelink {
clear: both;
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
margin: 0 auto;
padding: 0;
}

#main .inpagelink .link {
width: 470px;
box-sizing: border-box;
border-bottom: 1px solid #dedede;
margin: 0;
}

#main .inpagelink .link:nth-of-type(1) {
border-top: 1px solid #dedede;
}

#main .inpagelink .link:nth-of-type(2) {
border-top: 1px solid #dedede;
}

#main .inpagelink .link a {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: center;
align-items: center;
box-sizing: border-box;
background: url(/image/arrow_down.png) no-repeat 0 52%;
margin: 0 auto;
padding: 22px 0 15px 30px;
}

#main .inpagelink .link a:link, #main .inpagelink .link a:visited {
color: #111;
text-decoration: none;
}

#main .inpagelink .link a:active, #main .inpagelink .link a:hover {
color: #888;
text-decoration: none;
}

#main .inpagelink .link .text {
margin: 0;
}

#main .inpagelink a:hover img {
opacity: 0.8;
}

#main .inpagelink h3 {
color: #6fb4de;
font-size: 1.3rem;
line-height: 2rem;
margin: 0;
padding: 0;
}

#main .inpagelink h4 {
font-size: 1.9rem;
line-height: 2.6rem;
margin: 0;
padding: 15px 0;
}

#main .inpagelink .photo {
max-width: 150px;
margin-left: 30px;
padding: 0;
}

#main .inpagelink .photo img {
max-width: 150px;
margin: 0;
padding: 0;
}

#main p {
font-size: 1.5rem;
line-height: 3rem;
}

#main p a.common:link, #main p a.common:visited {
color: #111;
text-decoration: none;
}

#main p a.common:hover, #main p a.common:active {
color: #888;
text-decoration: none;
}

#main .statement {
width: 100%;
margin: -20px auto 60px auto;
}

#main .statement p {
font-size: 1.7rem;
line-height: 3.4rem;
}

#main .caution {
clear: both;
width: 100%;
box-sizing: border-box;
border: 1px solid #cdcdcd;
margin: 30px 0 10px 0;
padding: 15px 30px;
}

#main .caution p {
color: #555;
font-size: 1.3rem;
line-height: 2.7rem;
margin: 0;
}

#main p.supplement {
color: #555;
font-size: 1.3rem;
line-height: 2.6rem;
} 

#main th, #main td, #mail dt, #main dd {
font-size: 1.5rem;
line-height: 3rem;
}

#main.subpage a:link, #main.subpage a:visited {
font-size: 1.4rem;
color: #1a73e8;
text-decoration: underline;
}

#main.subpage a:hover, #main.subpage a:active {
color: #03c;
}

#main a.common:link, #main a.common:visited {
color: #1a73e8;
text-decoration: underline;
}

#main a.common:hover, #main a.common:active {
color: #03c;
}

#main a.pdf {
display: inline-block;
min-height: 18px;
background: url(/image/icon_pdf.png) no-repeat 0 50%;
background-size: 18px;
padding: 0 0 0 26px;
}

#main a.pdf:link, #main a.pdf:visited {
color: #1a73e8;
text-decoration: underline;
}

#main a.pdf:hover, #main a.pdf:active {
color: #03c;
}

#main a.inner:link, #main a.inner:visited {
color: #1a73e8;
text-decoration: underline;
background: url(/image/arrow_small.png) no-repeat 0 50%;
padding: 0 0 0 15px;
}

#main a.inner:hover, #main a.inner:active {
color: #03c;
}

#main a.outer:link, #main a.outer:visited {
color: #1a73e8;
text-decoration: underline;
background: url(/image/arrow_small.png) no-repeat 0 50%;
padding: 0 0 0 15px;
}

#main a.outer:hover, #main a.outer:active {
color: #03c;
}

#main .row-btn {
clear: both;
padding: 30px 0 20px 0;
margin: 0 auto;
text-align: center;
}

#main a.btn {
display: inline-block;
color: #fff;
font-size: 1.6rem;
font-weight: bold;
box-sizing: border-box;
letter-spacing: 0.1rem;
text-decoration: none;
background: #edaa1a;
padding: 15px 40px;
cursor: pointer;
}

#main a.btn:hover {
color: #fff;
background: #eb9403;
text-decoration: none;
cursor: pointer;
}

#main a.btn-back {
display: inline-block;
width: 280px;
color: #111;
font-size: 1.6rem;
font-weight: bold;
letter-spacing: 0.1rem;
background: #f1f1f1;
text-decoration: none;
padding: 15px 0;
cursor: pointer;
}

#main a.btn-back:hover {
color: #555;
cursor: pointer;
}

#main dl.common {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0 0 10px 0;
padding: 10px 0;
}

#main dl.common dt {
width: 25%;
font-size: 1.5rem;
line-height: 2.5rem;
letter-spacing: 0.1rem;
font-weight: bold;
box-sizing: border-box;
background: #d8ecf8;
border-bottom: 2px solid #fff;
padding: 16px 25px;
}

#main dl.common dt:first-of-type {
border-top: 1px solid #d8ecf8;
}

#main dl.common dt:last-of-type {
border-bottom: 1px solid #d8ecf8;
}

#main dl dt a:link, #main dl dt a:visited {
display: inline;
color: #111;
padding-bottom: 2px;
border-bottom: 2px solid #111;
text-decoration: none;
}

#main dl dt a:hover, #main dl dt a:active {
color: #555;
padding-bottom: 2px;
border-bottom: 2px solid #555;
text-decoration: none;
}

#main dl.common dd {
width: 75%;
font-size: 1.5rem;
line-height: 2.8rem;
box-sizing: border-box;
background: #fff;
border-right: 1px solid #dedede;
border-bottom: 1px solid #dedede;
padding: 16px 25px;
}

#main dl.common dd:first-of-type {
border-top: 1px solid #dedede;
}

#main dl.common dd p {
font-size: 1.5rem;
letter-spacing: 0.05rem;
margin: 0;
}

#main dl.common dd p:nth-child(n+2) {
margin-top: 15px;
}

#main dl.common dd p.supplement {
color: #555;
font-size: 1.3rem;
line-height: 2.6rem;
}

#main dl.common dd li {
position: relative;
padding-left: 15px;
}

#main dl.common dd li::before {
position: absolute;
content: '';
top: 13px;
left: 0;
width: 4px;
height: 4px;
border-radius: 50%;
background: #6fb4de;
}

.row-columns {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-start;
justify-content: flex-start;
margin: 0 0 30px 0;
}

.top .row-columns {
margin: 0 0 30px 0;
}

.row-columns .column:nth-child(n+2) {
margin: 0 0 0 30px;
}

.row-columns .image {
width: 380px;
margin: 0 0 5px 0;
}

.row-columns .image img {
width: 100%;
}

.row-columns .image a:hover img {
opacity: 0.8;
transition: all .3s ease;
}

.row-columns .text h2 {
font-size: 1.7rem;
line-height: 1.9rem;
font-weight: bold;
letter-spacing: 0.05rem;
margin: 0 0 12px 0;
}

.row-columns .text h2 a {
display: block;
background: url(/image/arrow.png) no-repeat 0 50%;
padding: 0 0 0 21px;
}

.row-columns .text h2 a.long {
background: url(/image/arrow.png) no-repeat 0 3px;
}

.row-columns .text p {
font-size: 1.4rem;
line-height: 2.6rem;
padding: 0 0 0 20px;
}

.row-columns .text ul {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
padding-top: 6px;
}

.row-columns .text li {
font-size: 1.5rem;
margin: 0 22px 5px 0;
}

.row-columns .text li a {
background: url(/image/arrow_small.png) no-repeat 0 55%;
padding: 0 0 0 13px;
}

.row-columns2 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
margin: 0 0 30px 0;
}

.top .row-columns2 {
margin: 0 0 30px 0;
}

.row-columns2 .image {
margin: 0 0 5px 0;
}

.row-columns2 .image a:hover img {
opacity: 0.8;
transition: all .3s ease;
}

.row-columns2 .text h2 {
font-size: 1.7rem;
line-height: 1.9rem;
font-weight: bold;
letter-spacing: 0.05rem;
margin: 0 0 12px 0;
}

.row-columns2 .text h2 a {
display: block;
background: url(/image/arrow.png) no-repeat 0 50%;
padding: 0 0 0 21px;
}

.row-columns2 .text h2 a.long {
background: url(/image/arrow.png) no-repeat 0 3px;
}

.row-columns2 .text p {
font-size: 1.4rem;
line-height: 2.6rem;
padding: 0 0 0 20px;
}

.row-column1 {
width: 100%;
margin: 0 0 70px 0;
}

.row-column1 .image {
margin: 0 0 5px 0;
}

.row-column1 .image p {
margin: 0 0 0 0;
}

.row-column1 .image:hover {
opacity: 0.8;
transition: all .3s ease;
}

.row-column1 .text h2 {
font-size: 1.7rem;
line-height: 1.7rem;
font-weight: bold;
letter-spacing: 0.05rem;
margin: 0 0 10px 0;
}

.row-column1 .text h2 a {
display: block;
vertical-align: baseline;
background: url(/image/arrow.png) no-repeat 0 50%;
padding: 0 0 0 25px;
}

.row-column1 .text p {
font-size: 1.4rem;
line-height: 2.6rem;
padding: 0 0 0 25px;
}

#news {
width: 100%;
margin: 0 0 40px 0;
}

#news dd a:link, #news dd a:visited {
color: #111;
text-decoration: none;
}

#news dd a:active, #news dd a:hover {
color: #888;
text-decoration: none;
}

#news h2 {
font-size: 2.2rem;
font-weight: bold;
letter-spacing: 0.1rem;
margin: 0 0 15px 0;
padding: 0;
}

#news dl {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
border-bottom: 1px solid #dedede;
margin: 0;
padding: 12px 0;
}

#news dl:first-of-type {
border-top: 1px solid #dedede;
}

#news dl:last-of-type {
margin-bottom: 10px;
}

#news .date {
min-width: 125px;
margin-right: 10px;
}

#news .category {
min-width: 120px;
margin-right: 30px;
padding: 5px 0;
}

#news .category span {
display: inline-block;
min-width: 120px;
background: #111;
color: #fff;
text-align: center;
font-weight: bold;
font-size: 1.1rem;
line-height: 1.4rem;
letter-spacing: 0.1rem;
padding: 5px 10px;
}

#news .category.news span {
background: #111;
}
#news .category.pressrelease span {
background: #777;
}
#news .category.sustainability span {
background: #7cb342;
}
#news .category.recruit span {
background: #70b3dd;
}

.link-archive {
text-align: right;
font-weight: bold;
margin: 0 0 8px 0;
}

.link-archive span {
background: url(/image/arrow.png) no-repeat 0 50%;
background-size: 13px;
padding: 0 0 0 20px;
}

.link-archive a:link, .link-archive a:visited {
color: #111;
text-decoration: none;
}

.link-archive a:active, .link-archive a:hover {
color: #888;
text-decoration: none;
}


/* ----------------------------------------------------------------
1200-
----------------------------------------------------------------- */

@media (min-width: 1200px) {

#main a.btn {
display: inline-block;
width: 280px;
color: #fff;
font-size: 1.6rem;
font-weight: bold;
box-sizing: border-box;
letter-spacing: 0.1rem;
background: #edaa1a;
padding: 15px;
cursor: pointer;
}

}

/* ----------------------------------------------------------------
-1200
----------------------------------------------------------------- */

@media (max-width: 1200px) {

#header .inner {
width: 90%;
height: 96px;
}

#sitepath nav ol {
width: 90%;
overflow: hidden;
}

#sitepath nav li {
white-space: nowrap;
}

#mv-image .text {
width: 90%;
text-align: left;
z-index: 3;
margin: 0 auto;
}

#mv-text .text {
width: 90%;
text-align: left;
z-index: 3;
margin: 0 auto;
}

#main {
width: 90%;
margin: 0 auto 30px auto;
}

#main .statement {
width: 100%;
}

.row-columns .column {
width: 30%;
margin: 0;
}

.row-columns .column:nth-child(n+2) {
width: 30%;
margin-left: 5%;
}

.row-columns .image {
width: 100%;
}

.row-columns .image p {
margin: 0;
padding: 0;
}

.row-columns .image img {
width: 100%;
}

.row-columns .text h2 a.long {
background: url(/image/arrow.png) no-repeat 0 50%;
}

.row-columns2 .column {
width: 48%;
margin: 0;
}

.row-columns2 .image {
width: 100%;
margin: 0 0 10px 0;
}

.row-columns2 .image img {
width: 100%;
}

.row-columns .text ul {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
padding-top: 6px;
}

#footer-banner {
width: 100%;
height: 200px;
margin: 0 auto;
}

#footer-banner li p.en {
font-size: 1.2rem;
letter-spacing: 0.1rem;
}

#footer-banner li p.ja {
font-size: 1.7rem;
letter-spacing: 0.3rem;
}

#footer-banner li#footer-banner-sustainability p.ja {
letter-spacing: 0.1rem;
}

}

/* ----------------------------------------------------------------
-1078
----------------------------------------------------------------- */

@media (max-width: 1078px) {

#footer .inner {
width: 90%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}

#footer-link {
width: 100%;
}

#footer-link .column1 {
width: 33%;
min-width: auto;
box-sizing: border-box;
border-left: 1px solid #eae5e3;
border-right: 1px solid #eae5e3;
padding: 0 25px;
}

#footer-link .column2 {
width: 33%;
min-width: auto;
box-sizing: border-box;
border-right: 1px solid #eae5e3;
padding: 0 25px;
}

#footer-link .column3 {
width: 33%;
min-width: auto;
box-sizing: border-box;
border-right: 1px solid #eae5e3;
padding: 0 25px;
}

.row-column1 {
width: 100%;
overflow: hidden;
}

.row-column1 .image {
width: 100%;
overflow: hidden;
}

.row-column1 .image img {
width: 100%;
}

}

/* ----------------------------------------------------------------
-1000
----------------------------------------------------------------- */

@media (max-width: 1000px) {

#main .inpagelink {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
margin: 0 auto;
padding: 0;
}

#main .inpagelink .link:nth-of-type(2) {
border-top: none;
}

#main .inpagelink .link {
width: 100%;
box-sizing: border-box;
margin: 0;
padding: 0;
}

#main .inpagelink .photo {
width: 100%;
margin: 0;
padding: 0;
}

#main .inpagelink .link a .text {
width: 60%;
}

#main .inpagelink .link a .photo {
width: 30%;
}

#main .inpagelink .link a .photo img {
width: 100%;
}

#footer-copyright ul {
width: 90%;
}
#footer-copyright li {
margin: 0 0 10px 0;
padding: 0 0 0 0;
}
#footer-copyright li:nth-of-type(5)::after {
content: '|';
display: inline-block;
font-size: 1.1rem;
color: #555;
padding: 0 15px;
}
#footer-copyright li:nth-of-type(8)::after {
content: '|';
display: inline-block;
font-size: 1.1rem;
color: #555;
padding: 0 15px;
}

}



/* ----------------------------------------------------------------
750-
----------------------------------------------------------------- */

@media (min-width: 750px) {

#header #logo img {
height: 31px;
}

#header.top #logo img {
height: 41px;
}

#header.top.fixed #logo img {
height: 31px;
}


}

/* ----------------------------------------------------------------
-750
----------------------------------------------------------------- */

@media (max-width: 750px) {

body {
font-family: 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-size: 1.5rem;
line-height: 2.7rem;
}

.pconly {
display: none;
}

.sponly {
display: block;
}

#header {
width: 100%;
height: 70px;
}
#header.top {
width: 100%;
height: 70px;
}

#header .inner {
width: 90%;
height: 70px;
}
#header.top .inner {
width: 90%;
height: 70px;
}

#header.top.fixed {
height: 60px;
animation: appearsp 0.4s;
}

#header.fixed {
height: 60px;
animation: appearsp 0.4s;
}

#header.fixed .inner {
height: 60px;
}

@keyframes appearsp {
0% { height: 70px; margin-top: -70px; }
100% { height: 60px; margin-top: 0; }
}

#header #logo {
z-index: 100;
margin: 0;
padding: 0;
}

#header #logo img {
height: 28px;
padding: 10px 0 0 0;
}
#header.top #logo img {
height: 28px;
}
#header.top.fixed #logo img {
height: 28px;
}

#header nav ul#mainnav {
display: none;
}

#sitepath nav li::after {
padding: 0 7px;
}

#mv-image {
position: relative;
width: 100%;
height: 300px;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
background: url(/image/mv_common.jpg) no-repeat 0 50%;
background-size: cover;
z-index: 1;
margin-top: 112px;
}

#mv-image .text h1 {
font-size: 2.5rem;
line-height: 3.7rem;
letter-spacing: 0.05rem;
}

#mv-image .text p {
width: 100%;
font-size: 1.4rem;
line-height: 2.4rem;
}

#mv-image .text p:first-of-type {
padding-top: 0;
}

#mv-text {
margin-top: 112px;
}

#mv-image .text h1 {
font-size: 2.5rem;
line-height: 3.7rem;
letter-spacing: 0.05rem;
}

#main {
width: 90%;
padding-top: 40px;
margin: 0 auto 30px auto;
}

#main .statement {
margin: -20px auto 40px auto;
}

#main p {
font-size: 1.5rem;
line-height: 2.7rem;
}

#news {
width: 100%;
margin: 0 0 40px 0;
}

#news h2 {
font-size: 2rem;
font-weight: bold;
letter-spacing: 0.1rem;
margin: 0 0 15px 0;
padding: 0;
}

#news dl {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-align-items: center;
align-items: center;
border-bottom: 1px solid #dedede;
margin: 0;
padding: 10px 0 12px 0;
}

#news .date {
margin-right: 20px;
}

#news .category {
min-width: 0px;
padding: 4px 6px;
}

#news .title {
display: block;
width: 100%;
line-height: 2.4rem;
padding-top: 5px;
}

#main .statement {
width: 100%;
}

#main .statement p {
font-size: 1.6rem;
line-height: 3rem;
}

.row-columns {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
margin: 0 0 30px 0;
}

.row-columns .column {
width: 100%;
margin: 0 0 30px 0;
}

.row-columns .column:nth-child(n+2) {
width: 100%;
margin: 0 0 30px 0;
}

.row-columns2 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-flex-direction: column;
flex-direction: column;
margin: 0;
}

.row-columns2 .column {
width: 100%;
margin: 0 0 30px 0;
}

#footer-banner {
height: auto;
}

#footer-banner ul {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}

#footer-banner p {
margin: 0;
padding: 0;
}

#footer-banner li {
background: #222;
border-bottom: 1px solid #999;
}

#footer-banner li#footer-banner-company {
width: 100%;
}
#footer-banner li#footer-banner-business {
width: 100%;
}
#footer-banner li#footer-banner-sustainability {
width: 100%;
}

#footer-banner li#footer-banner-recruit {
display: block;
width: 100%;
}

#footer-banner li#footer-banner-top {
width: 100%;
}

#footer-banner li a {
display: block;
width: 100%;
height: 100%;
margin: 0;
padding: 15px 0;
background: url(/image/arrow_right.png) no-repeat 5% 50%;
}

#footer-banner li a:link, #footer-banner li a:visited,
#footer-banner li a:hover, #footer-banner li a:active {
color: #eee;
}

#footer-banner li a:hover {
color: #aaa;
}

#footer-banner li p.en {
display: none;
}

#footer-banner li p.ja {
font-size: 1.7rem;
letter-spacing: 0.1rem;
margin-bottom: 0;
}

#footer-banner li::before {
display: none;
}

#footer-banner li::after {
display: none;
}

#footer .inner #footer-link {
display: none;
}

#footer .inner {
width: 90%;
text-align: left;
margin: 0 auto;
padding: 30px 0 20px 0;
}

#footer .inner #footer-info {
width: 100%;
text-align: center;
margin: 0;
padding: 0;
}

#footer-info .privacymark p {
text-align: center;
margin: 0 auto;
}

#footer-copyright li::after {
content: '|';
display: inline-block;
font-size: 1.1rem;
color: #555;
padding: 0 8px;
}

#footer-copyright li:nth-of-type(5)::after {
padding: 0 8px;
}

#footer-copyright li:nth-of-type(8)::after {
padding: 0 8px;
}

#main dl.common dt {
width: 25%;
padding: 10px 10px;
}

#main dl.common dd {
width: 75%;
padding: 10px 12px;
}

#main dl.common dd:first-of-type {
border-top: 1px solid #dedede;
}

#main dl.common dd p {
font-size: 1.5rem;
letter-spacing: 0.05rem;
margin: 0;
}

#main dl.common dd p:nth-child(n+2) {
margin-top: 15px;
}

#main dl.common dd p.supplement {
color: #555;
font-size: 1.3rem;
line-height: 2.6rem;
}

#main dl.common dd li {
position: relative;
padding-left: 15px;
}

#main dl.common dd li::before {
position: absolute;
content: '';
top: 13px;
left: 0;
width: 4px;
height: 4px;
border-radius: 50%;
background: #6fb4de;
}

#main .row-btn {
padding: 20px 0 20px 0;
}

#submenu {
display: none;
}

#news .date {
min-width: 100px;
margin-right: 20px;
}

#news .category {
min-width: 120px;
margin-right: 0;
padding: 5px 0;
}

.categorylist {
clear: both;
margin: 0 auto 60px auto;
}

.categorylist ul li {
margin-bottom: 2px;
padding: 0;
}

.categorylist ul li::after {
content: '|';
color: #ccc;
padding: 0 20px;
}

.categorylist ul li:first-of-type::before {
content: '|';
color: #cdcdcd;
padding: 0 20px 0 0;
}

#main a.pdf {
display: inline-block;
min-height: 18px;
background: url(/image/icon_pdf.png) no-repeat 0 8px;
background-size: 18px;
padding: 0 0 0 26px;
}

#main dl dt a:link, #main dl dt a:visited {
display: inline;
color: #111;
padding-bottom: 1px;
border-bottom: 1px solid #111;
}


}