@charset "utf-8";
html {
scroll-behavior: smooth;
}
body{
background: url(../img/bk-rainbow-small.png) no-repeat right -50px / 600px auto;
}
.wrapper{
width: 90%;
max-width: 1200px;
margin:0 auto;
}
.wrapper700{
width: 700px;
margin:0 auto;
}
.wrapper900{
width: 900px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
body {
background: url(../img/bk-rainbow-small.png) no-repeat right 0 / 100px auto;
}
.wrapper,
.wrapper700,
.wrapper900{
width:90%;
}
}
/*index*/
/*========= 流れるテキスト ===============*/
.slide-in {
overflow: hidden;
display: inline-block;
}
.slide-in_inner {
display: inline-block;
}
/*左右のアニメーション*/
.leftAnime{
opacity: 0;/*事前に透過0にして消しておく*/
}
.slideAnimeLeftRight {
animation-name:slideTextX100;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes slideTextX100 {
from {
transform: translateX(-100%); /*要素を左の枠外に移動*/
opacity: 0;
}
to {
transform: translateX(0);/*要素を元の位置に移動*/
opacity: 1;
}
}
.slideAnimeRightLeft {
animation-name:slideTextX-100;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes slideTextX-100 {
from {
transform: translateX(100%);/*要素を右の枠外に移動*/
opacity: 0;
}
to {
transform: translateX(0);/*要素を元の位置に移動*/
opacity: 1;
}
}
/*左右のアニメーション*/
.rightAnime{
opacity: 0;/*事前に透過0にして消しておく*/
}
.slideAnimeLeftRight {
animation-name:slideTextX100;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes slideTextX100 {
from {
transform: translateX(-100%); /*要素を左の枠外に移動*/
opacity: 0;
}
to {
transform: translateX(0);/*要素を元の位置に移動*/
opacity: 1;
}
}
.slideAnimeRightLeft {
animation-name:slideTextX-100;
animation-duration:0.8s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes slideTextX-100 {
from {
transform: translateX(100%);/*要素を右の枠外に移動*/
opacity: 0;
}
to {
transform: translateX(0);/*要素を元の位置に移動*/
opacity: 1;
}
}
/*========= 流れるテキスト ここまで===============*/
.header{
width: 100%;
height: 110px;
margin-bottom: 180px;
}
.top-page .header{
width: 100%;
position: absolute;
z-index: 2;
height: 110px;
/*position: -webkit-sticky;
position: sticky;*/
top: 0;
/*background-color: rgba(255,255,255,0.7);*/
}
.header-section-wrapper{
display: flex;
justify-content: space-between;
}
.header-logo-wrapper{
margin-top: 40px;
}
.header-nav{
margin-right: 50px;
margin-left: auto;
display: flex;
margin-top: 60px;
}
.header-nav ul{
display: flex;
flex-wrap: wrap;
}
.header-nav > ul > li{
margin-left:50px;
}
.header-nav > ul > li:first-of-type{
margin-left:0;
}
.header-nav > ul > li > a{
position: relative;
}
.header-nav > ul > li > a:hover{
opacity: 1 !important;
}
.top-page .header-nav > ul > li > a{
color: #000;
font-weight: 500;
}
.header-nav > ul > li > a:hover,
.header-nav > ul > li > a.active{
padding-bottom:5px;
border-bottom: 2px solid #d02d26;
}
.header-nav ul li a:hover::before,
.header-nav ul li a.active::before{
/* position: absolute;
content: '';
bottom: -7px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
display: block;
width: 45px;
height: 2px;
background: #d02d26;
background-size: contain;
background-repeat: no-repeat;*/
}
a.btn-contact {
/* padding: 40px 0;*/
display: flex;
align-items: center;
justify-content: center;
font-size: 1.6rem;
width: 240px;
height: 60px;
position: relative;
margin-top: 40px;
border-radius: 60px;
}
/*a.btn-contact::before {
content: "";
width: 25px;
height: 20px;
background: url(../img/icon-envelope.png);
background-repeat: no-repeat;
display: inline-block;
margin-right: 5px;
position: absolute;
top: 25px;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}*/
a.btn-large-contact {
padding: 10px 28px;
border-radius: 100vh;
display: flex;
align-items: center;
justify-content: center;
width: 280px;
font-size: 1.8rem;
font-weight: bold;
}
a.btn-large-contact::before {
content: "";
width: 23px;
height: 18px;
background: url(../img/icon-envelope.png);
background-repeat: no-repeat;
display: inline-block;
margin-right: 5px;
}
@media screen and (max-width: 1000px) {
.header-nav{
margin-right:10px;
margin-left:10px;
}
.header-nav > ul > li{
margin-left:20px;
}
}
@media screen and (max-width: 768px) {
.header-logo-wrapper{
margin-top: 5px;
}
a.btn-large-contact {
width: 225px;
padding: 5px;
margin: 0 auto;
}
}
a.btn--blue {
color: #fff;
background-color: #3575bd;
}
a.btn--orange {
color: #fff;
background-color: #ea5413;
}
a.btn--pink {
color: #fff;
background-color: #ff83b2;
}
.mega_link {
position: relative;
}
.mega_link::after {
content: "▼";
color:#3575bd;
font-size: 1.2rem;
margin-left:3px;
}
.mega_menu {
display: none;
width: 1000px;
position: absolute;
left: 50%;
margin-left: -500px;
top: 110px;
background: #fff;
padding: 60px 50px;
z-index: 10;
box-shadow: 0px 0px 16px -6px rgba(151, 194, 218, 0.9);
border-radius: 10px;
height: 320px;
}
.mega_menu::before {
content: "";
position: absolute;
border: 12px solid transparent;
/* border-top: 12px solid #ffc4c4; */
border-bottom: 17px solid rgba(151, 194, 218, 0.7);
/* border-top: 18px solid #f05b5b; */
border-right: 20px solid transparent;
border-left: 20px solid transparent;
}
.mega_menu.company-profile::before {
top: -29px;
left: 535px;
}
.mega_menu::after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
/* border-top: 16px solid #ffc4c4; */
border-right: 20px solid transparent;
border-left: 20px solid transparent;
border-bottom: 18px solid #fff;
}
.mega_menu.company-profile::after {
top: -17px;
left: 531px;
}
.mega_menu .list__arrow-red li{
width: 33%;
}
.mega_menu.company-profile .list__arrow-red{
width: 600px;
row-gap: 20px;
}
.mega_menu.safety::before {
top: -29px;
left: 632px;
}
.mega_menu.safety::after {
top: -17px;
left: 628px;
}
.mega_menu-safety-flex{
column-gap: 40px;
width: 100%;
}
.mega_menu-safety-flex_left{
width: 280px;
}
.mega_menu-safety-flex_right{
width: calc(100% - 320px);
}
.mega_menu-safety-flex_right .list__arrow-red{
width: 100%;
}
.mega_menu-safety-flex_right .list__arrow-red li{
width: 40%;
}
.mega_menu-company-flex {
column-gap: 40px;
width: 100%;
}
.mega_menu-company-flex_left {
width: 280px;
}
.mega_menu-company-flex_right {
width: calc(100% - 320px);
}
.header-telno{
font-size: 2.0rem;
color: #fff;
text-shadow:1px 1px 0 #ff83b2, -1px -1px 0 #ff83b2,
-1px 1px 0 #ff83b2, 1px -1px 0 #ff83b2,
0px 1px 0 #ff83b2, 0 -1px 0 #ff83b2,
-1px 0 0 #ff83b2, 1px 0 0 #ff83b2;
}
.footer{
background: #4b4948;
padding: 80px 0;
}
.footer p,
.footer li,
.footer a{
color: #fff;
}
.footer .wrapper{
display: flex;
justify-content: space-between;
position:relaitve;
}
.footer-list{
display: flex;
margin-bottom: 25px;
position: relative;
}
@media screen and (max-width: 768px) {
.footer .wrapper{
width: 260px;
margin: 0 auto;
}
}
/*.footer-list::before{
width: 23px;
height: 35px;
background: url(../img/icon-company-logo.png);
background-repeat: no-repeat;
display: inline-block;
position: absolute;
top: 25px;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}*/
.footer-list li{
margin-right: 25px;
}
.footer-list li a{
font-size: 1.4rem;
}
.copy{
display: flex;
justify-content: center;
}
.copy small{
font-size: 1.0rem;
color: #fff;
}
.pagetop {
display: none;
position: fixed;
bottom: 80px;
right: 10px;
z-index: 999;
opacity: .8;
}
.textbox {
position: fixed;
top: 100px;
right: 0%;
}
.vertical {
writing-mode: vertical-rl;
text-orientation: mixed;
background: #fff;
padding: 15px 10px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.vertical__yellow{
border-top: 5px solid #ffda04;
border-left: 5px solid #ffda04;
border-bottom: 5px solid #ffda04;
}
.vertical__orange{
border-top: 5px solid #ea5413;
border-left: 5px solid #ea5413;
border-bottom: 5px solid #ea5413;
}
.vertical__green{
border-top: 5px solid #54b65b;
border-left: 5px solid #54b65b;
border-bottom: 5px solid #54b65b;
}
.vertical__part {
text-orientation: upright;
}
.vertical_icon{
width: 20px;
margin-bottom: 10px;
}
/*top-mainvisual*/
.top-mainvisual{
height: 710px;
background-image: url(../img/bk-rainbow.png);
background-size: contain;
background-repeat: no-repeat;
background-position: top right;
padding-top: 240px;
}
.top-mainvisual__text{
margin-left: 70px;
}
@media screen and (max-width: 768px) {
.top-mainvisual__text{
margin-left: 0px;
}
}
.top-mainvisual__text h2,
.top-mainvisual__text h2 span{
color: #fff;
font-weight: 700;
text-align: center;
font-size: 3.3rem;
line-height: 2;
}
/*.top-mainvisual__img-sakura{
margin-bottom: 40px;
}*/
@media screen and (max-width: 1100px) {
.top-mainvisual{
background-size: cover;
background-position: top 50px right -100px;
}
}
@media screen and (max-width: 768px) {
.top-mainvisual h2 img{
width:250px;
}
.header{
padding-top: 5px;
height: 60px;
margin-bottom: 45px;
/* position: static;*/
}
.header h1 img{
width: 110px;
height: auto;
}
.header-section-wrapper{
justify-content: flex-start;
}
a.btn-contact{
max-width: 120px;
padding: 0;
font-size: 1.2rem;
height: 30px;
margin-top: 5px;
}
a.btn-contact::before {
width: 14px;
height: 11px;
background-size: contain;
}
.header-contact{
margin-right: 50px;
margin-left: auto;
}
.header-telno{
font-size: 1.6rem;
}
.top-mainvisual{
height: 380px;
padding-top: 80px;
}
.top-mainvisual__text h2,
.top-mainvisual__text h2 span{
font-size: 1.6rem;
}
.top-mainvisual__text{
margin-bottom: 10px;
}
.footer{
padding: 40px 0 25px;
}
.footer-list{
display: none;
}
.pagetop {
right: 20px;
}
.pagetop img{
width: 40px;
height: 40px;
}
}
.section-top-company-profile{
padding: 40px 0 100px;
}
@media screen and (max-width: 768px) {
.section-top-company-profile{
padding: 20px 0 35px;
}
}
.top-company-profile-flex{
align-items: stretch;
column-gap: 90px;
}
.top-company-profile-flex__left{
flex: 1;
min-height: 0;
position: relative;
}
.top-company-profile-flex__left img{
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
@media screen and (max-width: 1200px) {
.top-company-profile-flex__left{
flex: none;
width: 100%;
max-width: 350px;
margin: 0 auto 40px;
}
}
@media screen and (max-width: 768px) {
.top-company-profile-flex__left{
margin: 0 auto 20px;
}
}
.title__toppage{
font-size: 12.0rem;
line-height: 1.2;
}
.subtitle__blue{
color: #3575bd;
font-size: 3.6rem;
}
@media screen and (max-width: 768px) {
.title__toppage{
font-size:4.0rem;
}
.subtitle__blue{
font-size: 1.6rem;
}
}
.color-items-flex{
column-gap: 20px;
row-gap: 40px;
}
.section-top-company-profile .color-items-flex{
margin-left: auto;
margin-right:0;
max-width: 740px;
width: 100%;
}
@media screen and (max-width: 1200px) {
.section-top-company-profile .color-items-flex{
margin-left: auto;
margin-right:auto;
}
}
.color-item {
position: relative;
display: block;
width: calc(33.3333% - 40px/3);
height: 220px;
border-radius: 50px 0 50px 0;
color: white;
text-decoration: none;
padding: 20px;
}
.color-item::after {
content: "";
background-image: url(../img/icon-circle-arrow.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
height: 40px;
width: 40px;
position: absolute;
right: 30px;
bottom: 20px;
}
@media screen and (max-width: 768px) {
.color-item {
width: calc(33.3333% - 20px/3);
height: 100px;
border-radius: 20px 0 20px 0;
padding: 5px;
}
.color-items-flex{
column-gap: 10px;
row-gap: 10px;
}
.color-item::after {
height: 20px;
width: 20px;
right: 8px;
bottom: 5px;
}
}
.color-item_1 {
background-color: #e86c51;
}
.color-item_2 {
background-color: #e8d762;
}
.color-item_3 {
background-color: #ee984d;
}
.color-item_4 {
background-color: #63b37b;
}
.color-item_5 {
background-color: #3fb1df;
}
.color-item .vertical_title {
position: absolute;
top: 20px;
right: 30px;
writing-mode: vertical-rl;
font-family: "Zen Old Mincho", serif;
font-family:'ZenOldMincho-Bold';
font-weight: 600;
letter-spacing: 0;
line-height: 1.2;
font-size: 3.0rem;
font-weight: normal;
color: #fff;
}
.color-item .horizontal_title {
position: absolute;
bottom: 20px;
left: 20px;
font-family: "Zen Old Mincho", serif;
font-family:'ZenOldMincho-Bold';
font-weight: 600;
font-size: 16px;
letter-spacing: 1.5px;
font-weight: normal;
display: flex;
align-items: center;
color: #fff;
width: 80%;
}
@media screen and (max-width: 768px) {
.color-item .vertical_title {
top: 5px;
right: 10px;
font-size: 1.6rem;
}
.color-item .horizontal_title {
width: 92%;
font-size: 1.0rem;
line-height: 1;
bottom: 7px;
left: 7px;
letter-spacing: 0;
}
}
/*.color-item .horizontal_title::after {
content: "";
background-image: url(../img/icon-circle-arrow.png);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
height: 40px;
width: 40px;
position: absolute;
right: 0;
bottom: 0;
}*/
.section-top-security{
padding: 90px 0 130px;
}
.section-top-security__content{
max-width: 690px;
width: 100%;
margin-right: 0;
margin-left:auto;
}
@media screen and (max-width: 768px) {
.section-top-security__content{
max-width: 240px;
}
}
.section-top-group-company{
padding: 90px 0;
}
.three-columns-items{
column-gap: 30px;
row-gap:40px;
}
.top-group-c-img{
width: calc(33.3333% - 60px/3);
}
.top-group-c-img a{
width: 100%;
height: 300px;
}
@media screen and (max-width: 768px) {
.three-columns-items{
row-gap: 20px;
column-gap: 10px;
}
.top-group-c-img{
width: calc(50% - 10px / 2);
}
.top-group-c-img a{
width: 100%;
height: 0;
padding: 36%;
}
.section-top-security{
padding: 30px 0 40px;
}
.section-top-group-company{
padding: 30px 0 40px;
}
}
.bk-circle-img{
background: url(../img/bk-circle-img.png) no-repeat right 50px top 80px;
}
@media screen and (max-width: 768px) {
.bk-circle-img{
background: url(../img/bk-circle-img.png) no-repeat right -80px top 30px / 100% auto;
}
}
.top-group-c-img01{
background: url(../img/top-group-c-img01.jpg) no-repeat center / cover;
}
.top-group-c-img02{
background: url(../img/top-group-c-img02.jpg) no-repeat center / cover;
}
.top-group-c-img03{
background: url(../img/top-group-c-img03.jpg) no-repeat center / cover;
}
.top-group-c-img04{
background: url(../img/top-group-c-img04.jpg) no-repeat center / cover;
}
.top-group-c-img05{
background: url(../img/top-group-c-img05.jpg) no-repeat center / cover;
}
.top-group-c-img06{
background: url(../img/top-group-c-img06.jpg) no-repeat center / cover;
}
.top-group-c-img07{
background: url(../img/top-group-c-img07.jpg) no-repeat center / cover;
}
.top-group-c-img08{
background: url(../img/top-group-c-img08.jpg) no-repeat center / cover;
}
.top-group-c-img09{
background: url(../img/top-group-c-img09.jpg) no-repeat center / cover;
}
.btn__border-skelton{
display: flex;
align-items: center;
justify-content: center;
font-size: 1.6rem;
width: 240px;
height: 60px;
border:1px solid #000;
border-radius: 60px;
}
@media screen and (max-width: 768px) {
.btn__border-skelton{
font-size: 1.3rem;
width: 120px;
height: 30px;
}
}
.section-top-security__content .list__arrow-red{
column-gap: 50px;
}
.section-top-security__content .list__arrow-red li{
width: calc(50% - 50px/2);
}
.list__arrow-red li::before{
display: inline-block;
vertical-align: -10px;
content:"";
width: 40px;
height: 40px;
background: url(../img/icon-circle-arrow___red.png) no-repeat center / contain;
margin-right:10px;
}
.section-top-security__content .list__arrow-red li a{
font-size: 2.4rem;
font-weight: 500;
}
.mega_menu .list__arrow-red li::before{
width: 31px;
height: 31px;
}
.mega_menu .list__arrow-red li a{
font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
.section-top-security__content .list__arrow-red{
column-gap: 10px;
row-gap: 2px;
}
.section-top-security__content .list__arrow-red li {
width: 100%;
}
.list__arrow-red li::before {
width: 20px;
height: 20px;
vertical-align: -3px;
}
.section-top-security__content .list__arrow-red li a{
font-size: 1.6rem;
}
}
.illust-side{
position: relative;
}
.illust-side:before{
content: '';/*何も入れない*/
width: 152px;/*画像の幅*/
height: 125px;/*画像の高さ*/
background-image: url(../img/illust01.png);
background-size: contain;
vertical-align: middle;
position:absolute;
left: 50%;
margin-left: -380px;
}
.illust-side:after{
content: '';/*何も入れない*/
width: 152px;/*画像の幅*/
height: 144px;/*画像の高さ*/
background-image: url(../img/illust02.png);
background-size: contain;
vertical-align: middle;
position:absolute;
top: 0;
left: 50%;
margin-left: 250px;
}
@media screen and (max-width: 768px) {
.illust-side p{
font-size: 1.4rem;
}
.illust-side:before {
width: 40px;
height: 35px;
margin-left: -155px;
background-repeat: no-repeat;
}
.illust-side:after {
background-repeat: no-repeat;
width: 40px;
height: 45px;
margin-left: 115px;
}
}
.category-circle-link{
display: flex;
justify-content: space-around;
}
.category-circle-link__item{
background: #fff;
width: 250px;
height: 250px;
border-radius: 100%;
}
.category-circle-link__item.circle-w200{
width: 200px;
height: 200px;
}
.category-circle-link__item a{
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
@media screen and (max-width: 768px) {
.category-circle-link{
flex-wrap: wrap;
}
.category-circle-link__item,
.category-circle-link__item.circle-w200 {
background: #fff;
width: 105px;
height: 105px;
border-radius: 100%;
}
}
.item__yellow{
border: 10px solid #ffda04;
}
.item__orange{
border: 10px solid #ea5413;
}
.item__green{
border: 10px solid #54b65b;
}
@media screen and (max-width: 768px) {
.item__yellow{
border: 5px solid #ffda04;
}
.item__orange{
border: 5px solid #ea5413;
}
.item__green{
border: 5px solid #54b65b;
}
}
.slider img {
width:100%;/*スライダー内の画像を横幅100%に*/
height:auto;
}
/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider .slick-slide {
margin:0 10px;/*スライド左右の余白調整*/
}
.section-top-products-link{
position: relative;
}
.section-top-products-link-section1{
height: 300px;
}
.zoom{
width: 100%;
height: 300px;
overflow: hidden;
}
.zoom-1 img {
width: 100%;
height: 300px;
object-fit: cover;
animation: animationZoom1 5s ease-in-out forwards;
}
@media screen and (max-width: 768px) {
.zoom,
.zoom-1 img{
height: 220px;
}
}
@keyframes animationZoom1 {
100% { transform:scale(1.1)}
}
.section-map iframe{
width: 100% !important;
height: 300px !important;
vertical-align:middle;
/*filter:grayscale(100%);
-webkit-filter:grayscale(100%);*/
}
@media screen and (max-width: 768px) {
.section-map iframe{
height: 250px !important;
}
}
.section-footer-logo-contact{
padding: 60px 0;
}
@media screen and (max-width: 768px) {
.section-footer-logo-contact .wrapper660{
max-width: 350px;
width: 95%;
}
}
.footer-logo-contact-wrap{
display: flex;
justify-content: space-between;
}
.footer-logo{
display: flex;
margin-bottom: 20px;
}
.footer-logo img{
margin-right:10px;
width: 51px;
height: 54px;
}
.tel-contact-wrap{
width: 300px;
}
.footer-tel{
color: #0864b2;
font-size: 3.4rem;
font-weight: 700;
}
.footer-tel::before{
content: '';
display: inline-block;
width: 33px;
height: 33px;
background-image: url(../img/icon-tel.png);
background-size: contain;
margin-right: 7px;
}
@media screen and (max-width: 768px) {
.section-footer-logo-contact{
padding: 35px 0;
}
.footer-logo-contact-wrap{
display: block;
width: 80%;
margin: 0 auto;
}
.footer-logo-wrap{
margin-bottom: 20px;
}
}
/*---------------main-contents----------------*/
.main-contents{
padding-bottom: 90px;
}
@media screen and (max-width: 768px) {
.main-contents{
padding-bottom: 70px;
}
}
/*---------------breadcrumb----------------*/
.breadcrumb {
height: 30px;
background: #fceea6;
}
.breadcrumb span, .breadcrumb span a {
font-size: 1.2rem;
line-height: 30px;
transform: rotate(0.03deg);
}
.breadcrumb span a:after {
content: '/';
padding: 0 5px;
}
.breadcrumb span > a > span {
/*text-decoration: underline;*/
}
@media screen and (max-width: 768px) {
.breadcrumb {
display: none;
}
}
/*---------------pagenavi---------------*/
.wp-pagenavi a,
.wp-pagenavi span{
margin-right: 15px;
font-weight: 500;
}
.wp-pagenavi span.current{
border-bottom: 1px solid;
}
.wp-pagenavi a:hover{
border-bottom: 1px solid;
}
.wp-pagenavi a:last-child{
margin-right: 0;
}
@media screen and (max-width: 768px) {
.wp-pagenavi a,
.wp-pagenavi span{
font-size: 1.4rem;
}
}
.pagenavi-single-post a,
.pagenavi-single-post span {
margin-right: 30px;
}
.pagenavi-single-post a:last-child{
margin-right: 0;
}
/*---------------main-visual----------------*/
.mainvisual{
height: 120px;
}
.mainvisual-title{
font-size: 3.0rem;
font-weight:700;
line-height: 1;
}
.mainvisual-title.zen-old-mincho-medium{
font-size: 4.8rem;
font-family:'ZenOldMincho-Bold';
font-weight: 600;
font-style: normal;
}
@media screen and (max-width: 768px) {
.mainvisual{
height: 80px;
}
.mainvisual-title{
font-size: 1.8rem;
}
.mainvisual-title.zen-old-mincho-medium{
font-size: 3.0rem;
}
}
/*---------------common_box-------------------*/
.common_container{
display:grid;
gap:70px;
}
.common_box .headline{
margin-bottom:96px;
font-family:'ZenOldMincho-Bold';
font-size:28px;
line-height:2;
}
.common_box > h2{
margin-bottom:35px;
font-family:'ZenOldMincho-Bold';
font-size:28px;
line-height:2;
}
.common_box > p{
font-family:'ZenOldMincho-Bold';
font-size:18px;
line-height:2;
}
.common_box > p > a,
.common_box > p > a > u{
font-family:'ZenOldMincho-Bold';
font-size:18px;
line-height:2;
}
.common_box > ul{
display:grid;
gap:10px;
margin:0;
padding-left:20px;
}
.common_box > ul li{
font-family:'ZenOldMincho-Bold';
font-size:18px;
line-height:2;
}
.common_box > ol{
display:grid;
gap:30px;
margin:0;
padding-left:20px;
}
.common_box > ol li{
font-family:'ZenOldMincho-Bold';
font-size:18px;
line-height:2;
}
/*.disclaimer .common_box > ol li{
list-style-type: decimal;
unicode-bidi: isolate;
}*/
.disclaimer .common_box > ol {
list-style-type: none;
counter-reset: item-count;
padding-left: 2.5em;
margin-left: 0;
}
.disclaimer .common_box > ol > li {
display: list-item;
counter-increment: item-count;
margin-bottom: 2em;
position: relative;
}
/* カッコ付きの数字 (1) を生成 */
.disclaimer .common_box > ol > li::marker {
content: "(" counter(item-count) ") ";
}
.common_box .list{
display:grid;
gap:30px;
margin-top:30px;
}
.common_box .list h3{
margin-bottom:15px;
padding-bottom:10px;
/*font-family:'kozminpro-medium';*/
font-family:'ZenOldMincho-Bold';
font-size:20px;
line-height:2;
border-bottom:2px dotted #23231e;
}
.common_box .list p{
/*font-family:'kozminpro-medium';*/
font-family:'ZenOldMincho-Bold';
font-size:18px;
line-height:2;
}
.common_box .list ul{
margin:0;
padding-left:20px;
}
.common_box .list ul li{
margin-top:10px;
/*font-family:'kozminpro-medium';*/
font-family:'ZenOldMincho-Bold';
font-size:18px;
}
.common_box .line{
margin-top:30px;
padding:20px 0;
/*font-family:'kozminpro-medium';*/
font-family:'ZenOldMincho-Bold';
font-size:18px;
text-decoration:underline;
border-top:2px dotted #23231e;
border-bottom:2px dotted #23231e;
}
.common_box .line ul{
display:grid;
gap:20px;
margin:0;
padding:0;
}
.common_box .line ul li{
list-style:none;
}
.common_box .cookie{
display:grid;
gap:55px;
margin-top:55px;
}
.common_box .cookie h3{
display:flex;
align-items:center;
gap:20px;
margin-bottom:30px;
font-family:'kozminpro-medium';
font-size:20px;
}
.common_box .cookie h3 span{
display:flex;
justify-content:center;
align-items:center;
width:36px;
height:36px;
font-family:'ZenOldMincho-Bold';
font-size:18px;
color:#ffffff;
background-color:#23231e;
}
.common_box .cookie p{
font-family:'kozminpro-medium';
font-size:18px;
line-height:40px;
}
.common_box .cookie ul{
margin:30px 0 0;
padding:0;
border-top:2px dotted #23231e;
}
.common_box .cookie ul li{
padding:20px 0;
font-family:'kozminpro-medium';
font-size:18px;
border-bottom:2px dotted #23231e;
list-style:none;
}
.common_memo{
margin-top:60px;
}
.common_memo p{
font-family:'kozminpro-medium';
font-size:18px;
line-height:2;
}
.privacy_common_memo{
margin-top:20px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:2;
text-align:right;
}
.common_link_container{
display:grid;
gap:40px;
padding-bottom:40px;
border-bottom:2px dotted #23231e;
}
.common_link{
}
.common_link h2{
margin-bottom:20px;
padding:10px 20px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:2;
color:#ffffff;
background-color:#23231e;
}
.common_link a{
font-family:'kozminpro-medium';
font-size:18px;
line-height:2;
color:#0075c2;
text-decoration:underline;
}
.mynumber_copy_box {
font-family: 'kozminpro-medium';
font-size: 18px;
line-height: 2;
display: flex;
gap: 10px;
margin-bottom: 18px;
align-items: center;
}
.mynumber_copy_box button {
display: flex;
align-items: center;
justify-content: center;
background-color: #0075C2;
border-radius: 20px;
color: white;
width: 100px;
height: 40px;
min-height: 40px;
font-family: 'kozminpro-medium';
letter-spacing: 3px;
font-size: 18px;
border: none;
cursor: pointer;
}
.mynumber_copy_box .copy_btn{
display:flex;
align-items: center;
gap:20px;
}
.privacy_common_memo > p{
margin-top: 20px;
font-family: 'kozminpro-medium';
font-weight: normal;
font-style: normal;
font-size: 18px;
line-height: 2;
text-align: right;
}
@media screen and (max-width: 768px) {
.common_container{
gap:60px;
}
.common_box .headline{
margin-bottom:48px;
font-size:21px;
}
.common_box > h2{
margin-bottom:30px;
font-size:21px;
}
.common_box > p{
font-size:16px;
}
.common_box > ul{
gap:5px;
}
.common_box > ul li{
font-size:16px;
}
.common_box > ol{
gap:40px;
}
.common_box > ol li{
font-size:16px;
}
.common_box .list{
gap:25px;
margin-top:45px;
}
.common_box .list h3{
margin-bottom:10px;
padding-bottom:10px;
font-size:17px;
}
.common_box .list p{
font-size:16px;
}
.common_box .list ul li{
margin-top:10px;
font-size:16px;
}
.common_box .line{
margin-top:30px;
padding:20px 0;
font-size:18px;
text-decoration:underline;
border-top:2px dotted #23231e;
border-bottom:2px dotted #23231e;
}
.common_box .cookie{
gap:42px;
margin-top:42px;
}
.common_box .cookie h3{
margin-bottom:22px;
font-size:20px;
}
.common_box .cookie h3 span{
font-size:18px;
}
.common_box .cookie p{
font-size:16px;
line-height:34px;
}
.common_box .cookie ul{
margin:20px 0 0;
}
.common_box .cookie ul li{
padding:16px 0;
font-size:16px;
}
.common_memo{
margin-top:45px;
}
.common_memo p{
font-size:16px;
}
.privacy_common_memo{
margin-top:20px;
font-size:16px;
}
.common_link_container{
gap:30px;
padding:0;
border:none;
}
.common_link{
padding-bottom:25px;
border-bottom:2px dotted #23231e;
}
.common_link h2{
margin-bottom:22px;
font-size:16px;
}
.common_link a{
font-size:16px;
}
.mynumber_copy_box .copy_btn{
flex-direction:column;
gap:5px;
}
}
/*--------------company----------------*/
.mainvisual-company {
height: 170px;
margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
.mainvisual-company {
height: 80px;
margin-bottom: 20px;
}
}
.section-title-wrapper{
margin-bottom: 20px;
}
.title__section{
font-size: 9.0rem;
line-height: 1;
}
.subtitle__blue__section{
color: #3575bd;
font-size: 2.4rem;
}
.catchcopy__section{
font-size: 4.0rem;
}
@media screen and (max-width: 768px) {
.title__section {
font-size: 3.6rem;
line-height: 1;
}
.subtitle__blue__section {
color: #3575bd;
font-size: 1.4rem;
}
.catchcopy__section{
font-size: 2.6rem;
}
}
.catchcopy__section__blue{
color: #3575bd;
font-size: 3.7rem;
letter-spacing: -2.5px;
}
@media screen and (max-width: 768px) {
.catchcopy__section__blue{
font-size: 2.6rem;
text-align: justify;
}
}
.company_document {
margin-top: 48px;
}
.company_document .info_box {
font-family: 'kozminpro-medium';
padding: 30px 0 30px 0;
flex-wrap: nowrap;
display: flex;
font-size: 2.4rem;
letter-spacing: 3px;
border-bottom: 1px solid #dfe3e3;
}
.company_document h4 {
font-family: 'kozminpro-medium';
min-width: 200px;
font-weight: 400;
}
.company_document p{
font-family: 'kozminpro-medium';
}
.company_document .info_flex{
flex:1;
}
@media screen and (max-width: 768px) {
.company_document {
margin-top: 0;
}
.company_document .info_box {
font-family: 'kozminpro-medium';
padding: 0;
flex-wrap: nowrap;
display: flex;
flex-direction: column;
font-size: 18pt;
border-bottom: 1px solid #DFE3E3;
padding: 40px 0;
line-height: 40px;
}
.company_document .info_box h4 {
font-weight: 400;
font-size: 1.6rem;
margin-bottom: 10px;
}
.company_document .info_box p {
margin-top: 0;
font-size: 16px;
}
.company_document .map_info {
margin: 30px 0 50px 0;
}
.company_document .map_info img {
margin-top: 0;
height: 35px;
}
}
.item__philosophy{
padding: 50px 0;
border-bottom: 2px solid #3575bd;
position: relative;
}
.bottom__blue-triangle::after{
content: "";
width: 29px;
height: 25px;
background: url(../img/icon-triangle_w29h25.png) no-repeat center / contain;
position:absolute;
bottom: -1px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
.item__philosophy__title{
color: #3575bd;
font-size: 6.0rem;
font-family: "Red Hat Display", sans-serif;
font-family:'RedHatDisplay-Bold';
font-weight:600;
line-height: 1.2;
}
.item__philosophy__subtitle{
color: #3575bd;
font-family:'ZenOldMincho-Bold';
font-weight: 500;
font-size: 2.3rem;
}
.item__philosophy__catchcopy{
font-family:'ZenOldMincho-Bold';
font-weight: 500;
font-size: 3.2rem;
}
@media screen and (max-width: 768px) {
.item__philosophy{
padding: 20px 0;
border-bottom: 1px solid #3575bd;
}
.bottom__blue-triangle::after{
width: 15px;
height: 12px;
}
.item__philosophy__title{
font-size: 4.2rem;
}
.item__philosophy__catchcopy{
font-size: 1.8rem;
letter-spacing: -1px;
}
}
.item__philosophy__ol{
width: 100%;
max-width: 550px;
margin:0 auto;
}
.item__philosophy__ol li{
list-style-type: decimal;
font-family:'ZenOldMincho-Bold';
font-weight: 500;
font-size: 2.8rem;
}
@media screen and (max-width: 768px) {
.item__philosophy__ol ol{
margin-left: 20px;
}
.item__philosophy__ol li{
font-size: 1.8rem;
letter-spacing: -1px;
}
}
.box_content {
display:none;
width: 100%;
padding: 40px 60px 80px 60px;
font-size: 16pt;
line-height: 34pt;
letter-spacing: 2px;
/* display: flex;
flex-direction: column;
gap: 4px; */
box-sizing: border-box;
margin-top: 3px;
background-clip: padding-box;
background-color: #F8FAFA;
}
.box_content a {
color: #0075C2;
font-size: 20px;
margin: 20px 0 20px 0;
text-decoration: underline;
}
.box_content .box_subtitle {
margin-bottom:4px;
padding: 20px;
color: #fff;
background-color: #8696A6;
}
.box_content .box_item {
display: grid;
grid-template-columns:180px 1fr;
margin-bottom:4px;
background-color: #F8FAFA;
}
.box_content .box_item .txt_underline {
text-decoration: underline;
}
.box_content .box_item .box_year {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
min-width: 180px;
min-height: 60px;
margin:0;
padding:10px 0;
font-size:18px;
line-height:34px;
text-align: center;
color: #fff;
background-color: #8696A6;
font-family:'kozminpro-medium';
letter-spacing: -.5px;
}
/*.box_content .box_item .bg_gray {
background-color: #595757;
}*/
.box_content .box_item .box_text {
font-family:'kozminpro-medium';
max-width: 798px;
border-bottom: 1px dotted #8696A6;
padding: 20px 0 20px 30px;
display: flex;
justify-content:center;
flex-grow: 1;
flex-direction: column;
line-height: 1.5;
letter-spacing:1.5px;
}
.box_content .box_item .box_text u {
display: inline;
color: #0075C2;
text-decoration: underline;
line-height: 1;
}
@media screen and (max-width: 768px) {
.btn_wapper {
font-family: 'kozminpro-medium';
margin: 0px 0 10px 0;
padding: 0;
}
.btn_wapper .btn_box {
width: 100%;
cursor: pointer;
}
.btn_wapper .btn_box .box_title {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 0;
}
.btn_wapper .btn_box .box_title span {
font-size: 20px;
line-height: 28pt;
letter-spacing: 5px;
padding-left: 20px;
}
.btn_wapper .btn_box .box_title .icon_plus {
width: 30px;
height: 30px;
color: #657689;
font-weight: 600;
padding-right: 20px;
}
.box_content {
width: 100%;
padding:30px 0px 40px;
font-size: 16pt;
line-height: 34pt;
letter-spacing: 2px;
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
/* display: flex;
flex-direction: column;
gap: 2px; */
}
.box_content .box_subtitle {
margin: 0 20px 2px;
padding: 14px 20px;
font-size: 16px;
line-height: 26px;
color: #fff;
background-color: #8696A6;
}
.box_content a {
padding: 0 20px;
}
.box_content .box_item {
display: flex;
flex-direction: column;
background-color: #F8FAFA;
margin-bottom:2px;
padding: 0 20px;
align-items: flex-start;
}
.box_content .box_item .txt_underline {
text-decoration: underline;
}
.box_content .box_item .box_year {
min-width:140px;
min-height:45px;
flex-direction: row;
gap: 10px;
font-size: 14px;
}
.box_content .box_item .w_min_100 {
min-width: 100%;
}
.box_content .box_item .bg_gray {
flex-direction:column;
gap:5px;
background-color: #595757;
font-size: 14px;
line-height:26px;
padding: 10px 20px;
}
.box_content .box_item .box_text {
border-bottom: 1px dashed #8696A6;
padding: 20px 0 20px 0;
display: flex;
flex-grow: 1;
flex-direction: column;
line-height: 2.5;
font-size: 16px;
line-height:30px;
width: 100%;
}
.box_content .box_item .box_text u {
display: inline;
color: #0075C2;
text-decoration: underline;
line-height: 1;
}
}
.disc-list{
margin-left: 15px;
}
.disc-list li{
list-style-type: none;
font-size: 1.6rem;
line-height: 2;
}
.disc-list li:before{
content: '';
width: 3px;
height: 3px;
display: inline-block;
border-radius: 100%;
background: #000;
position: relative;
left: -8px;
top: -3px;
}
@media screen and (max-width: 768px) {
.disc-list li{
font-size: 1.4rem;
line-height: 1.6;
}
}
/*-----------------safety----------------*/
.mainvisual-safety{
height: 230px;
margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
.mainvisual-safety{
height: 100px;
margin-bottom: 30px;
}
}
.title__section__mincho{
font-size: 4.8rem;
}
@media screen and (max-width: 768px) {
.title__section__mincho{
font-size: 2.4rem;
}
}
.company_safety_bg_1 {
/* background-image: url("images/company/safety_background_1.png");
background-size: cover;
background-repeat: no-repeat;
padding-top: 100px;
background-position:top -1px center;*/
}
.company_safety_content_1 {
max-width: 1100px;
margin: 0 auto 100px;
color: #23231E;
overflow: hidden;
}
.company_safety_content_1 .content_head {
display: flex;
align-items: center;
}
.company_safety_content_1 .content_head h1 {
margin: 0;
font-weight: bold;
font-size: 140px;
line-height: 160pt;
font-family: 'RedHatDisplay-Bold';
letter-spacing: 9px;
white-space: nowrap;
}
.company_safety_content_1 .content_head p {
font-size: 45px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
letter-spacing: 12px;
writing-mode: vertical-rl;
text-align: center;
margin: auto;
}
.company_safety_content_1 h2 {
display: flex;
align-items: center;
font-size: 40px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
letter-spacing: 7px;
margin: 70px 0 63px 0;
}
.company_safety_content_1 h2 span {
display:flex;
justify-content:center;
align-items:center;
background-color: #23231e;
color: white;
font-size: 26px;
font-family:'RedHatDisplay-SemiBold';
letter-spacing: 5px;
line-height: 29px;
height: 64px;
width: 64px;
margin-right: 37px;
}
.company_safety_content_1 .contents .content_1 h3 {
text-align: center;
font-size: 28px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
position: relative;
padding: 10px 0;
letter-spacing: 5px;
border-top: 1px #23231E solid;
border-bottom: 1px #23231E solid;
margin: 63px 0 48px 0;
}
.company_safety_content_1 .contents .content_1 h3::before {
top: 0;
}
.company_safety_content_1 .contents .content_1 h3::after {
bottom: 0;
}
.company_safety_content_1 .contents .content_1 p {
display: flex;
align-items: baseline;
font-family:'kozminpro-medium';
margin: 12px 0;
font-size: 20px;
line-height:40px;
font-weight: 200;
letter-spacing: 1.5px;
padding: 0;
}
.company_safety_content_1 .contents .content_1 p span {
display: flex;
flex-shrink: 0;
justify-content: center;
align-items: center;
width: 36px;
height: 36px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
background-color: #0075c2;
color: white;
font-size: 18px;
font-weight: bold;
margin-right: 24px;
}
.company_safety_content_1 .contents .content_2 p {
font-family: 'kozminpro-medium';
line-height: 40px;
font-size: 18px;
margin: 0 0 60px 0;
}
.company_safety_content_1 .contents .content_2 p.line_1 {
font-size: 32px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
}
.company_safety_content_1 .contents .content_3 .list {
list-style: none;
padding: 0;
margin: 60px 0;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
font-size: 22px;
line-height: 50px;
}
.company_safety_content_1 .contents .content_3 .list li {
/*display: flex;
align-items: center;*/
margin: 10px 0;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
font-size: 22px;
}
.company_safety_content_1 .contents .content_3 .list li::before {
content: "";
width: 32px;
height: 32px;
background-image: url('../img/square_check_b.png');
background-size: cover;
background-position: center;
margin-right: 26px;
display: inline-block;
vertical-align: -5px;
}
.company_safety_content_1 .contents .content_2 .sign_line {
text-align: right;
font-size: 20px;
font-family:'ZenOldMincho-Bold';
font-weight: normal;
margin-top: 20px;
margin-right: 20px;
letter-spacing: 2px;
}
.company_safety_content_1 .contents .content_2 .sign_line_name {
margin-left: 20px;
}
.company_safety_content_1 .contents .content_1 img {
width: 100%;
margin-bottom: 53px;
}
.company_safety_content_1 .contents .content_4 .custom-link {
display: flex
;
justify-content: space-between;
font-family: 'kozminpro-medium';
letter-spacing: 4px;
align-items: center;
text-decoration: none;
font-size: 28px;
color: #333;
padding: 52px 0;
width: 100%;
border-bottom: 1px solid #ccc;
}
.company_safety_content_1 .contents .content_4 .custom-link::after {
content: "";
width: 40px;
height: 40px;
background-image: url(../img/right_cycle_arrow_1.png);
background-size: cover;
background-position: center;
display: inline-block;
margin-right: 20px;
}
.company_safety_content_1 .contents .content_4 .custom-link:hover::after {
background-image: url(../img/right_cycle_arrow_b.png);
}
@media screen and (max-width: 768px) {
/*.company_safety_content_1 {
margin: 0 20px;
}*/
.company_safety_content_1 .content_head h1 {
letter-spacing: 4px;
font-size: 55px;
line-height: 47px;
}
.company_safety_content_1 .content_head p {
font-size: 25px;
letter-spacing: 6px;
}
.company_safety_bg_1 {
padding-top: 0px;
background-position: center;
height: auto;
}
.company_safety_content_1 h2 {
align-items:baseline;
font-size: 25px;
line-height:43px;
letter-spacing: 3px;
margin: 40px 0 30px 0;
}
.company_safety_content_1 h2 span {
font-size: 16px;
letter-spacing: 0px;
line-height: 28px;
height: 40px;
width: 40px;
margin-right: 17px;
}
.company_safety_content_1 .contents .content_1 h3 {
font-size: 21px;
padding: 10px 0;
letter-spacing: 5px;
margin: 40px 0 27px 0;
}
.company_safety_content_1 .contents .content_1 p span {
width: 25px;
height: 25px;
font-family: 'ZenOldMincho', serif;
background-color: #0075c2;
color: white;
font-size: 13px;
font-weight: bold;
margin-right: 16px;
padding: 0;
}
.company_safety_content_1 .contents .content_1 p {
font-size: 16px;
font-weight: 200;
line-height:34px;
letter-spacing: 1.5px;
justify-content: flex-start;
}
.company_safety_content_1 .contents .content_2 p.line_1 {
font-size: 21px;
line-height: 45px;
}
.company_safety_content_1 .contents .content_2 p {
margin: 0 0 23px 0;
}
.company_safety_content_1 .contents .content_3 .list {
margin: 30px 0;
font-size: 16px;
line-height: 40px;
}
.company_safety_content_1 .contents .content_3 .list li{
font-size: 16px;
padding-left: 40px;
text-indent: -40px;
}
.company_safety_content_1 .contents .content_3 .list li::before {
width: 25px;
height: 25px;
margin-right: 16px;
vertical-align: -6px;
}
.company_safety_content_1 .contents .content_2 .sign_line {
font-size: 15px;
}
.company_safety_content_1 .contents .content_2 .sign_line_name {
font-size: 22px;
margin-left: 17px;
}
.company_safety_content_1 .contents .content_1 img {
margin-bottom: 23px;
}
.company_safety_content_1 .contents .content_4 .custom-link {
letter-spacing: 2px;
font-size: 21px;
padding: 22px 0;
}
}
.color-items-flex-safety{
gap: 40px;
}
.color-items-flex-safety .color-item {
width: calc(25% - 120px/4 );
height: 160px;
display: flex;
align-items: center;
justify-content: center;
padding: 20px 5px;
}
.color-items-flex-safety .color-item::after{
transform: translateY(-0%) rotate(90deg);
right:20px;
}
.color-item-text-sefty{
font-family: 'ZenOldMincho-Bold';
font-weight: 400;
letter-spacing: 0;
line-height: 1.2;
font-size: 2.0rem;
font-weight: normal;
color: #fff;
text-align: center;
}
@media screen and (max-width: 768px) {
.color-items-flex-safety{
gap: 10px;
}
.color-items-flex-safety .color-item {
width: calc(50% - 10px / 2);
height: 100px;
}
.color-item-text-sefty{
font-size: 1.2rem;
}
.color-items-flex-safety .color-item::after{
right:8px;
}
}
.color-item_6 {
background-color: #9793bc;
}
.color-item_7 {
background-color: #3c7db7;
}
.color-item_8 {
background-color: #aeaeae;
}
.activity_item{
max-width: 1100px;
margin: 0 auto;
margin-top: 96px;
}
.activity_item .mobile-only br{
display: none;
}
.activity_item h3{
font-size: 40px;
border-left: 8px solid #1575BC ;
padding-left: 40px;
letter-spacing: 6px;
font-family: 'ZenOldMincho-Bold';
font-weight: normal;
}
.activity_item .activity_content{
margin-top: 52px;
}
.activity_item .activity_content p{
font-size: 18px;
line-height: 40px;
letter-spacing: 2.5px;
font-family: 'kozminpro-medium';
}
.activity_item .activity_img{
margin-top: 48px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 24px;
}
.activity_item .activity_img img{
width: calc(50% - 12px);
height: auto;
}
@media screen and (max-width: 768px) {
.activity_item{
/*padding: 0 20px;*/
}
.activity_item .mobile-only br{
display: block;
}
.activity_item .activity_title{}
.activity_item .activity_title h3 {
font-size: 25px;
border-left: 8px solid #1575BC;
padding-left: 20px;
letter-spacing: 4px;
font-family: 'ZenOldMincho-Bold';
line-height: 43px;
}
.activity_item .activity_content {
margin-top: 40px;
}
.activity_item .activity_content p{
font-size: 16px;
line-height: 34px;
letter-spacing: 2px;
font-family: 'kozminpro-medium';
}
.activity_item .activity_img {
margin-top: 25px;
flex-direction: column;
gap: 16px;
}
.activity_item .activity_img img{
width: 100%;
height: auto;
object-fit: contain;
}
}
.activity_mtt{
margin-top: 120px;
}
.each_activity_title{}
.each_activity_title h3{
letter-spacing: 7px;
margin-bottom: 52px;
}
.each-activity_item{
display: flex;
flex-direction: column;
}
.each-activity_item .each-activity-title{
width: 85%;
margin: 0 auto;
}
.each-activity_item .each-activity-title .activity-title-img{
width: 100%;
}
.each-activity{
display: flex;
max-width: 1100px;
margin: 30px auto 0 auto;
gap: 50px;
}
.each-activity.each-activity-p-wrapper{
width: calc(50% - 25px);
}
.each-activity .each-activity-p-wrapper .each-activity-p-content{
width: 100%;
font-size: 18px;
line-height: 40px;
letter-spacing: 2px;
font-family:'kozminpro-medium';
margin: 0;
}
.each-activity{
width: 50%;
}
.each-activity img{
width: 100%;
height: 100%;
max-height: 382px;
object-fit: cover;
}
@media screen and (max-width: 768px) {
.each_activity_title{}
.each_activity_title h3{
letter-spacing: 8px !important;
}
.each-activity_item{
display: flex;
flex-direction: column;
gap: 10px;
}
.each-activity_item .each-activity-title{
width: 100%;
margin: 0 auto;
}
.each-activity_item .each-activity-title .activity-title-img{
width: 100%;
content: url("../img/safety-each-activity-202602.png");
}
.each-activity{
display: flex;
max-width: 1100px;
margin: 20px auto 0 auto;
flex-direction: column;
gap: 10px;
}
.each-activity .each-activity-p-wrapper{
width: 100%;
}
.each-activity .each-activity-p-wrapper .each-activity-p-content{
width: 100%;
font-size: 16px;
line-height: 34px;
letter-spacing: 2px;
font-family:'kozminpro-medium';
margin: 0;
}
.each-activity{
width: 100%;
}
.each-activity img{
width: 100%;
height: 100%;
max-height: 382px;
object-fit: cover;
}
}
/*-----------------ofic-group-----------------*/
.mainvisual-ofic-group {
height: 280px;
margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
.mainvisual-ofic-group {
height: auto;
margin-bottom: 30px;
}
}
.ofic-group-flex{
width: 100%;
column-gap: 5%;
}
.ofic-group-flex__item_img{
width: 31.6%;
}
.ofic-group-flex__item_txt{
width: 62.5%;
}
@media screen and (max-width: 768px) {
.ofic-group-flex__item_img{
width: 100%;
text-align: center;
margin-bottom: 20px;
}
.ofic-group-flex__item_txt{
width: 100%;
}
}
.flex_w160dt dt{
width: 160px;
}
.flex_w160dt dd{
width: calc(100% - 160px);
}
@media screen and (max-width: 768px) {
.flex_w160dt dt{
width: 100px;
}
.flex_w160dt dd{
width: calc(100% - 100px);
}
}
.item__border-bottom-dotted{
border-bottom: 2px dotted #000;
padding: 30px 0;
}
.item__border-none{
padding: 30px 0;
}
@media screen and (max-width: 768px) {
.item__border-bottom-dotted{
padding: 10px 0;
}
.item__border-none{
padding: 10px 0;
}
}
.ofic-group-flex__item_txt .flex_w160dt dt,
.ofic-group-flex__item_txt .flex_w160dt dd{
font-size: 1.8rem;
line-height: 2.5;
font-family:'ZenOldMincho-Bold';
font-weight: 400;
font-style: normal;
}
a.btn__red-radius {
display: inline-block;
background: #d02d26;
padding: 8px 20px;
width: 100%;
height: 50px;
border-radius: 10px;
position: relative;
font-size: 2.0rem;
color: #fff;
font-weight: 500;
}
a.btn__red-radius.white-arrow::after{
content: "";
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
width: 16px;
height: 16px;
background: url(../img/icon-white-circle-arrow.png) no-repeat center / contain;
}
.ofic-group-flex__item_txt .title__section__mincho{
line-height: 1;
}
.blue-radius-wrapper{
background: #e9f3fb;
padding: 40px;
border-radius: 10px;
}
@media screen and (max-width: 768px) {
.blue-radius-wrapper{
padding: 20px;
}
}
.ofc-group-shosai-flex{
column-gap: 60px;
}
.ofc-group-shosai-item{
width: calc(50% - 60px/2);
}
@media screen and (max-width: 768px) {
.ofc-group-shosai-flex{
row-gap: 60px;
}
.ofc-group-shosai-item{
width: 100%;
}
}
.ofc-group-shosai-item.one-item{
width: 100%;
}
.ofic-group-flex__item_txt .flex_w160dt dt,
.ofic-group-flex__item_txt .flex_w160dt dd,
.ofic-group-flex__item_txt .flex_w160dt dd span,
.ofic-group-flex__item_txt .flex_w160dt dd a{
font-size: 1.8rem;
line-height: 2.5;
font-family:'ZenOldMincho-Bold';
font-weight: 400;
font-style: normal;
}
@media screen and (max-width: 768px) {
.ofic-group-flex__item_txt .flex_w160dt dt,
.ofic-group-flex__item_txt .flex_w160dt dd,
.ofic-group-flex__item_txt .flex_w160dt dd span,
.ofic-group-flex__item_txt .flex_w160dt dd a{
font-size: 1.6rem;
}
}
.ofic-group-flex__item_txt .flex_w160dt dd a{
text-decoration: underline;
}
.ofc-group-shosai__company-name-wrap{
height: 100px;
}
@media screen and (max-width: 768px) {
.ofc-group-shosai__company-name-wrap{
height: auto;
}
}
.ofc-group-shosai__company-subname{
font-family:'ZenOldMincho-Bold';
font-weight: 400;
font-size: 1.8rem;
}
.ofc-group-shosai__company-name{
font-family:'ZenOldMincho-Bold';
font-size: 2.4rem;
color: #005bac;
margin-bottom: 5px;
}
@media screen and (max-width: 768px) {
.ofc-group-shosai__company-subname{
font-size: 1.4rem;
}
.ofc-group-shosai__company-name{
font-size: 1.8rem;
}
}
.btn__blue-radius{
display: inline-block;
width: 230px;
height: auto;
padding:3px 35px 3px 20px;
background-color: #005bac;
border-radius: 5px;
color: #fff;
font-size: 1.6rem;
position: relative;
}
.btn__blue-radius.white-arrow::after{
content: "";
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
width: 16px;
height: 16px;
background: url(../img/icon-white-circle-arrow.png) no-repeat center / contain;
}
.btn__blue-radius.wauto{
width: auto;
}
.flex_w100dt{
padding: 10px 0;
}
.flex_w100dt dt{
width: 100px;
}
.flex_w100dt dd{
width: calc(100% - 100px);
}
@media screen and (max-width: 768px) {
.flex_w100dt{
padding: 5px 0;
}
.ofc-group-shosai-item .flex_w100dt dt{
width: 80px;
font-size: 1.6rem;
}
.ofc-group-shosai-item .flex_w100dt dd{
width: calc(100% - 80px);
font-size: 1.6rem;
}
}
.ofc-group-shosai-item .flex_w100dt dt,
.ofc-group-shosai-item .flex_w100dt dd{
font-size: 1.8rem;
font-family:'ZenOldMincho-Bold';
font-weight: 400;
font-style: normal;
}
.ofc-group-shosai-item .flex_w100dt dd .tel-link,
.ofc-group-shosai-item .flex_w100dt dd a{
font-size: 1.8rem;
font-family:'ZenOldMincho-Bold';
font-weight: 400;
font-style: normal;
}
@media screen and (max-width: 768px) {
.ofc-group-shosai-item .flex_w100dt dt,
.ofc-group-shosai-item .flex_w100dt dd,
.ofc-group-shosai-item .flex_w100dt dd .tel-link,
.ofc-group-shosai-item .flex_w100dt dd a{
font-size: 1.6rem;
}
}
.ofc-group-shosai-item .flex_w100dt dd a{
text-decoration: underline;
}
.ofc-group-shosai-item .flex_w100dt dt.lh12{
line-height: 1.2;
}
.ofc-group-shosai-item .flex_w100dt dd.lh12{
line-height: 1.2;
}
.ofic-group-flex__item_img__img img{
border-radius: 50px 0 50px 0;
height: 300px;
object-fit: inherit;
}
@media screen and (max-width: 768px) {
.ofic-group-flex__item_img__img{
width: 80%;
margin: 20px auto;
}
.ofic-group-flex__item_img__img img{
height:auto;
}
a.btn__red-radius{
width: 80%;
margin:10px auto;
font-size: 1.4rem;
text-align: left;
height: 40px;
}
}
/*----------------contact-----------------*/
.mainvisual-contact {
height: 360px;
margin-bottom: 100px;
}
.mainvisual-contact80 {
height: 80px;
margin-bottom: 80px;
}
.mainvisual-contact180 {
height: 180px;
margin-bottom: 180px;
}
@media screen and (max-width: 768px) {
.mainvisual-contact {
height: auto;
margin-bottom: 50px;
}
}
/*.company_contents .contact_2 {
max-width: 1100px;
margin: 0 auto;
font-family: 'kozminpro-medium';
font-size: 18px;
letter-spacing: 2.5px;
line-height: 40px;
margin-bottom: 130px;
}*/
.company_contents .contact_2:last-child{
margin-bottom:0;
}
.company_contents .contact_2 h2 {
font-family: 'ZenOldMincho-Bold';
font-weight: normal;
font-size: 54px;
letter-spacing: 14px;
line-height: 86px;
color: #0075c2;
margin: 0;
}
/*.company_contents .contact_2 p {
margin-top: 64px;
font-family: 'kozminpro-medium';
}*/
.t_red {
color: #e60012;
font-family: 'kozminpro-medium';
}
.company_contents .contact_2 .contact_form {
margin-bottom: 30px;
}
.company_contents .contact_2 .contact_form_title {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 45px;
}
.company_contents .contact_2 .contact_form_title h3 {
padding-left: 30px;
position: relative;
font-size: 22px;
letter-spacing: 6px;
line-height: 45px;
margin: 0;
font-family: 'kozminpro-medium';
}
.company_contents .contact_2 .contact_form_title h3::before {
content: "";
width: 8px;
height: 100%;
background-color: #0075c2;
position: absolute;
left: 0;
}
.company_contents .contact_2 .note {
margin: 0;
}
.company_contents .contact_2 .checkbox_group {
display: grid;
grid-template-columns: repeat(4, auto);
gap: 25px;
margin-bottom: 15px;
}
.company_contents .contact_2 .checkbox_group label {
display: flex;
align-items: center;
gap: 10px;
}
.company_contents .contact_2 input[type="checkbox"] {
height: 24px;
width: 24px;
}
.company_contents .contact_2 .dotted_line {
border-bottom: 2px dotted #000;
margin: 45px 0;
}
.company_contents .contact_2 .contact_form_text {
margin-top: 150px;
}
.company_contents .contact_2 .contact_form .form_group {
margin-bottom: 40px;
}
.company_contents .contact_2 .contact_form .form_group label {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 15px;
}
.company_contents .contact_2 .contact_form .form_group p {
margin-top: 0;
}
.company_contents .contact_2 .contact_form .form_group input {
width: 100%;
height: 66px;
box-sizing: border-box;
padding: 8px;
border: none;
border-radius: 5px;
background-color: #f0f0f0;
font-size: 18px;
}
.company_contents .contact_2 .contact_form .requireds {
padding: 0px 10px;
line-height: 32px;
color: white;
}
.company_contents .contact_2 .contact_form .required_1 {
background-color: #e60012;
}
.company_contents .contact_2 .contact_form .required_2 {
background-color: #595757;
}
.company_contents .contact_2 .contact_form .textarea_group textarea {
width: 100%;
height: 300px;
padding: 8px;
border: none;
border-radius: 5px;
background-color: #f0f0f0;
box-sizing: border-box;
}
.company_contents .contact_2 .contact_form .form_group .Attachments {
width: 100%;
height: 100px;
background-color: #f0f0f0;
display: flex;
align-items: center;
padding: 25px;
border-radius: 5px;
box-sizing: border-box;
font-family: "ryo-gothic-plusn", sans-serif;
margin-bottom: 20px;
}
.company_contents .contact_2 .contact_form .form_group .button_Attachments {
background-color: #ffffff;
border: 1px solid;
padding: 10px 25px;
cursor: pointer;
border-radius: 5px;
font-size: 18px;
font-family: "ryo-gothic-plusn", sans-serif;
letter-spacing: 3px;
}
.company_contents .contact_2 .contact_form .form_group .button_note {
margin-left: 25px;
color: #626060;
}
.company_contents .contact_2 .contact_form .Attachments_form_group {
margin-bottom: 80px;
}
.company_contents .contact_2 .contact_form .content_title {
font-size: 20px;
}
.company_contents .contact_2 .contact_form ol {
list-style: none;
counter-reset: list-counter;
padding-left: 0;
}
.company_contents .contact_2 .contact_form ol li {
counter-increment: list-counter;
display: flex;
align-items: flex-start;
gap: 40px;
margin-bottom: 10px;
}
.company_contents .contact_2 .contact_form p.content_center {
margin: 0 auto;
margin-top: 35px;
max-width: 800px;
}
.company_contents .contact_2 .contact_form .flex_center {
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
}
.company_contents .contact_2 .contact_form ol li::before {
content: counter(list-counter) ".";
flex-shrink: 0;
}
.company_contents .contact_2 .center {
text-align: center;
margin-top: 20px;
}
.company_contents .contact_2 .contact_form .btn_submit {
font-family: 'kozminpro-medium';
font-size: 18px;
letter-spacing: 3px;
background-color: #23231e;
width: 340px;
height: 60px;
color: white;
border: none;
cursor: pointer;
}
.company_contents .contact_2 .contact_form .btn_submit:hover {
background-color: #272725;
}
@media screen and (max-width: 768px) {
.company_contents .contact_2 h2 {
font-size: 39px;
letter-spacing: 8px;
line-height: 36px;
}
/*.company_contents .contact_2 p {
margin-top: 40px;
}*/
.company_contents .contact_2 .contact_form_title {
align-items: flex-start;
justify-content: space-between;
flex-direction: column;
margin-bottom: 20px;
}
/*.company_contents .contact_2 {
line-height: 35px;
margin-bottom: 90px;
padding: 0 20px;
}*/
.company_contents .contact_2 .checkbox_group {
grid-template-columns: repeat(1, auto);
gap: 15px;
}
.company_contents .contact_2 .contact_form_text {
margin-top: 50px;
}
}
.form{
margin-bottom:48px;
padding-bottom:96px;
border-bottom:2px dotted #23231e;
}
.form dl{
margin:0 0 40px;
}
.form dl:last-child{
margin:0;
}
.form dl dt{
margin-bottom:15px;
}
.form dl dt p{
display:flex;
justify-content:space-between;
align-items:center;
font-family:'kozminpro-medium';
font-size:20px;
}
.form dl dt p span{
padding:8px 12px;
font-size:16px;
line-height:1;
color:#ffffff;
font-family: 'kozminpro-medium';
}
.form dl dt p span.r_red{
background-color:#e60012;
}
.form dl dt p span.r_gray{
background-color:#595757;
}
.form dl dd{
margin:0;
}
.form dl dd input[type="text"],
.form dl dd input[type="email"],
.form dl dd input[type="tel"]{
width:100%;
padding:20px;
font-size:16px;
background-color:#f0f0f0;
border:none;
border-radius:6px;
}
.form dl dd textarea{
width:100%;
padding:20px;
font-size:18px;
line-height:1.5;
background-color:#f0f0f0;
border:none;
border-radius:6px;
resize:vertical;
}
.form dl dd .file_area{
padding:25px;
background-color:#f0f0f0;
border-radius:6px;
}
.form dl dd .memo{
margin-top:20px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:36px;
}
.form dl dd .wpcf7-not-valid-tip{
display:block;
margin-top:10px;
color:#e60012;
}
.contact_area .text{
margin-bottom:48px;
padding-bottom:48px;
border-bottom:2px dotted #23231e;
}
.contact_area .text h3{
margin-bottom:32px;
font-family:'kozminpro-medium';
font-size:20px;
line-height:36px;
text-align:center;
}
.contact_area .text ol{
margin:0;
}
.contact_area .text ol li,
.contact_area .text ol li > p{
margin-bottom:15px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:36px;
}
.contact_area .text > ol {
counter-reset: item-count;
}
.contact_area .text > ol > li {
counter-increment: item-count;
}
.contact_area .text > ol > li::marker {
content: counter(item-count) ". ";
}
.contact_area .text .tx{
max-width:800px;
margin:0 auto;
font-family:'kozminpro-medium';
font-size:18px;
line-height:36px;
}
.contact_area .text .tx a{
text-decoration:underline;
}
.contact_area .post{
}
.contact_area .post .check{
margin-bottom:48px;
}
.contact_area .post .check label{
display:flex;
/*justify-content:center;*/
align-items:center;
gap:20px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:36px;
}
.contact_area .post .check label input{
margin:0;
width:24px;
height:24px;
}
.contact_area .post .check .btn{
text-align:center;
}
.contact_area .post .check input{
width:340px;
height:60px;
font-family:'kozminpro-medium';
font-size:18px;
line-height:36px;
text-align:center;
color:#ffffff;
background-color:#23231e;
cursor:pointer;
}
.contact_area .post .check input:hover{
opacity:0.8;
}
.btn input.btn-contact {
/* padding: 40px 0; */
display: flex;
align-items: center;
justify-content: center;
font-family:'kozminpro-medium';
font-size: 1.8rem;
width: 240px;
height: 60px;
position: relative;
margin-top: 40px;
border-radius: 60px;
border: none;
}
.btn input.btn-contact.btn--blue {
color: #fff;
background-color: #3575bd;
}
@media screen and (max-width: 768px) {
.form{
margin-bottom:40px;
padding-bottom:80px;
}
.form dl{
margin:0 0 25px;
}
.form dl dt{
margin-bottom:15px;
}
.form dl dt p{
font-size:15px;
}
.form dl dt p span{
padding:6px 10px;
font-size:12px;
}
.form dl dd{
}
.form dl dd input[type="text"],
.form dl dd input[type="email"],
.form dl dd input[type="tel"]{
padding:15px;
font-size:14px;
border-radius:5px;
}
.form dl dd textarea{
padding:15px;
font-size:14px;
border-radius:5px;
}
.form dl dd .file_area{
padding:10px;
border-radius:5px;
}
.form dl dd .memo{
margin-top:15px;
font-size:16px;
line-height:31px;
}
.text{}
.text h3{
margin-bottom:20px;
}
.text ol{}
.text ol li{
margin-bottom:15px;
}
.text .tx{
font-size:16px;
}
.post{}
.post .btn{}
.post .btn input{
/*width:100%;*/
}
.contact_area .text ol{
margin-left:20px;
}
}
.section-circle-link{
padding: 60px 0;
}
@media screen and (max-width: 768px) {
.section-circle-link{
padding: 30px 0;
}
}
.wrapper_sold{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0,0,0,0.4);
}
.txt_sold{
background: #ea5413;
padding: 5px 10px;
border-radius: 5px;
color: #fff;
font-size: 1.6rem;
font-weight: 500;
}
.txt_negotiating{
background: #54b65b;
padding: 5px 10px;
border-radius: 5px;
color: #fff;
font-size: 1.6rem;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.txt_sold,
.txt_negotiating{
font-size: 1.2rem;
}
}
.pointer-none{
pointer-events: none;
}
.section-bulletin-board{
padding: 70px 0 80px;
}
.section-bulletin-board img{
width: 100%;
height: auto;
}
.section-property-listings{
padding-top: 70px;
}
@media screen and (max-width: 768px) {
.section-bulletin-board{
padding: 30px 0 40px;
}
.section-property-listings{
padding-top: 30px;
}
}
.section-bukken-single-info-wrap{
padding: 50px 0 70px;
}
.title_orange{
color: #ea5413;
font-size: 2.2rem;
font-weight: 700;
margin-bottom: 20px;
}
.list_orange-check li{
font-size: 1.8rem;
margin-bottom: 10px;
background-image: url(../img/icon-check-orange.png);
background-repeat: no-repeat;
background-size:auto 20px;
padding-left: 25px;
}
/*.list_orange-check li:before{
content: '';
display: inline-block;
width: 24px;
height: 20px;
background-image: url(../img/icon-check-orange.png);
background-size: contain;
background-repeat: no-repeat;
margin-right: 10px;
vertical-align: sub;
}*/
@media screen and (max-width: 768px) {
.title_orange{
font-size: 1.8rem;
margin-bottom: 10px;
}
.list_orange-check li{
font-size: 1.4rem;
}
.list_orange-check li{
background-size: auto 15px;
}
}
.detail_list {
/* width: 49%;*/
display: flex;
flex-wrap: wrap;
}
.detail_list li {
width: calc(50% - 20px/2);
margin-right: 20px;
color: #5b5b5b;
margin-bottom: 10px;
}
.detail_list li:nth-child(2n) {
margin-right: 0;
}
.detail_list li span {
padding: 2px 10px;
background: #fff;
display: inline-block;
width: 100%;
}
.detail_list li span.subttl {
font-weight: 500;
display: inline-block;
width: 100%;
background: #cfeaf6;
padding: 2px 10px;
}
@media screen and (max-width: 768px) {
.detail_list {
width: 100%;
}
.detail_list li {
margin-bottom: 5px;
width: 100%;
margin-right: 0;
}
.detail_list li span {
font-size: 1.2rem;
}
}
.section-bukken-map{
padding: 70px 0 0;
}
.section-bukken-map iframe{
width: 100% !important;
height: 450px !important;
}
@media screen and (max-width: 768px) {
.section-bukken-map{
padding: 30px 0 0;
}
.section-bukken-map iframe{
height: 200px !important;
}
}
/*-----------------company-----------------*/
.section-company-introduction {
padding: 40px 0 70px;
}
@media screen and (max-width: 768px) {
.section-company-introduction {
padding: 20px 0 35px;
}
}
.section-company-gaiyo{
padding-top: 70px;
}
.company-gaiyo__list{
display: flex;
flex-wrap: wrap;
margin-bottom: 50px;
}
.company-gaiyo__list:last-child{
margin-bottom: 0;
}
.company-gaiyo__list dt{
width: 125px;
color:#ea5413;
font-size: 1.6rem;
font-weight: 500;
transform: rotate(0.03deg);
}
.company-gaiyo__list dd{
width: calc(100% - 125px);
font-size: 1.6rem;
transform: rotate(0.03deg);
}
@media screen and (max-width: 768px) {
.section-company-gaiyo{
padding-top: 30px;
}
.company-gaiyo__list{
margin-bottom: 20px;
}
.company-gaiyo__list dt,
.company-gaiyo__list dd{
width: 100%;
font-size: 1.4rem;
}
}
/*-----------------access-----------------*/
.section-access-introduction {
padding: 40px 0 70px;
}
@media screen and (max-width: 768px) {
.section-access-introduction {
padding: 20px 0 35px;
}
}
.section-access-map iframe{
width: 100%;
height: 500px;
}
@media screen and (max-width: 768px) {
.section-access-map iframe{
height: 250px;
}
}
@media screen and (max-width: 768px) {
.tel-link > a {
/*color: #06F;
font-weight: bold;*/
text-decoration: underline;
}
.tel-link.txtRed > a {
color: #f00;
}
}
.section-access-txt{
padding-top: 70px;
}
.section-access-txt-item{
width: 460px;
margin: 0 auto;
max-width: 90%;
}
.indent7{
padding-left: 7em;
text-indent:-7em;
}
@media screen and (max-width: 768px) {
.section-access-txt{
padding-top: 30px;
}
.indent7{
padding-left: 0;
text-indent: 0;
}
}
/*-----------------privacy-----------------*/
.section-privacy-content{
padding-top: 70px;
}
@media screen and (max-width: 768px) {
.section-privacy-content{
padding-top: 40px;
}
}
.privacy-paragraph{
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #000;
}
.privacy-content-txt{
font-size: 1.6rem;
line-height: 2.2;
color: #000;
}
.privacy-title{
text-align: center;
font-size: 2.4rem;
color: #ea5413;
font-weight: 600;
line-height: 2.2;
}
@media screen and (max-width: 768px) {
.privacy-title{
font-size: 1.8rem;
margin:10px 0;
}
.privacy-content-txt{
font-size: 1.4rem;
line-height: 1.6;
}
}
/*-----------------info-----------------*/
.info-detail-title {
color: #ea5413;
font-size: 2.4rem;
font-weight: 700;
margin-bottom: 10px;
}
.info-detail-title::before{
content: '';/*何も入れない*/
display: inline-block;
width: 23px;/*画像の幅*/
height: 35px;/*画像の高さ*/
background-image: url(../img/icon-company-logo.png);
background-size: contain;
background-repeat: no-repeat;
/* vertical-align: b;*/
margin-right: 20px;
vertical-align: middle;
}
@media screen and (max-width: 768px) {
.info-detail-title {
font-size: 1.8rem;
margin-bottom: 15px;
padding-left: 40px;
text-indent: -45px;
}
}
.info-contents{
border-top: 1px solid #000;
border-bottom: 1px solid #000;
padding: 25px 0;
}
.info-contents p{
font-size: 1.6rem;
line-height: 2;
margin-bottom: 1em;
}
.info-detail__date_cat{
height: 60px;
display: flex;
align-items: center;
justify-content: flex-end;
}
@media screen and (max-width: 768px) {
.info-contents{
padding: 20px 0;
}
.info-contents p{
font-size: 1.4rem;
}
}
.pagenavi ul li{
margin-right: 18px;
}
.pagenavi ul li:last-child{
margin-right: 0;
}
.pagenavi ul li a{
color: #000;
font-size: 1.6rem;
}
.pagenavi ul li a.active,
.pagenavi ul li a:hover{
border-bottom: 1px solid #000;
}
/*-----------------contact-----------------*/
.section-contact-wrapper{
padding-top: 70px;
}
@media screen and (max-width: 768px) {
.section-contact-wrapper{
padding-top: 30px;
}
}
.contact__list{
display: flex;
flex-wrap: wrap;
margin-bottom: 30px;
}
.contact__list:last-child{
margin-bottom: 0;
}
.contact__list dt{
width: 200px;
color:#ea5413;
font-size: 1.6rem;
font-weight: 500;
transform: rotate(0.03deg);
}
.contact__list dd{
width: calc(100% - 200px);
font-size: 1.6rem;
transform: rotate(0.03deg);
}
@media screen and (max-width: 768px) {
.contact__list{
margin-bottom: 20px;
}
.contact__list dt,
.contact__list dd{
width: 100%;
}
.contact__list dt{
font-size: 1.4rem;
}
}
.contact-address-list{
display: flex;
align-items: center;
}
.contact-address-list_column1{
font-size: 1.4rem;
width: 80px;
}
.required{
color: #c0362f;
font-size: 1.4rem;
font-weight: 800;
margin-left: 20px;
}
@media screen and (max-width: 768px) {
.contact-address-list_column1{
font-size: 1.2rem;
width: 60px;
}
.required{
font-size: 1.2rem;
margin-left: 10px;
width: 40px;
}
}
.input{
border: 1px solid #d4d4d4;
font-weight:500;
padding: .5em .5em .5em .7em;
}
.select,
.textarea{
border: 1px solid #d4d4d4;
font-weight:500;
padding: .5em .5em .5em .7em;
}
.textarea{
width: 100%;
height: 250px;
}
.input_text01{
width:100%;
/*width: 300px;
max-width: 300px; */
}
.input_text02{
width: 180px;
}
.input_text03{
width: 300px;
max-width: 300px;
}
.select01{
width: 180px;
}
::placeholder {
opacity: .5;
}
@media screen and (max-width: 768px) {
.input,
.select,
.textarea{
font-size: 1.6rem;
}
.input_text01{
width: 100%;
/*width: calc(100% - 50px);*/
}
.input_text02,
.input_text03,
.select01{
max-width: 215px;
}
.contact-address-list_column2{
width: calc(100% - 137px);
}
.textarea{
width: 100%;
height: 180px;
}
}
.button-contact-submit{
font-size: 2.2rem;
color: #fff;
font-weight: 500;
width:250px;
height: auto;
padding: 10px;
background: #ea5413;
text-align: center;
position: relative;
border: none;
cursor: pointer;
}
.button_address{
font-size:1.6rem;
padding: 6px 10px;
background: #e0e0e0;
margin-left: 10px;
cursor: pointer;
}
.button_address:hover{
opacity: .7;
}
@media screen and (max-width: 768px) {
.button_address{
font-size: 1.2rem;
padding: 12px 5px;
}
}
/*-----------------slick-----------------*/
/*photo-slider サムネイル付写真slick*/
#photo-slider,
#photo-thumbnail_slider{
width: 100%;
margin: 0 auto 20px;
}
#photo-thumbnail_slider{
margin: 0 auto;
}
.slide-item img{
width: 100%;
}
.thumbnail-item img{
width: 98%;
margin: 0 auto;
}
#photo-slider .slick-next{
right:5px;
}
#photo-slider .slick-prev{
left:5px;
}
#photo-thumbnail_slider .slick-prev,
#photo-thumbnail_slider .slick-next{
background-color: #fff;
opacity: .8;
width: 20px;
height: 100%;
background-image: none;
background-position: center;
z-index:1;
border-radius:0;
-webkit-border-radius: 0;
top: 0;
margin-top: 0;
}
#photo-thumbnail_slider .slick-prev{
left: 0px;
}
#photo-thumbnail_slider .slick-next{
right: 0px;
}
#photo-thumbnail_slider .slick-prev::before{
content: "";
display:block;
width: 8px;
height: 16px;
margin-top: -8px;
background-image: url(../img/btn-prev.png);
background-size: contain;
background-repeat: no-repeat;
left: 30%;
}
#photo-thumbnail_slider .slick-next::before{
content: "";
display:block;
width: 8px;
height: 16px;
margin-top: -8px;
background-image: url(../img/btn-next.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 200;
left: 25%;
}
@media screen and (max-width: 768px) {
#photo-slider,
#photo-thumbnail_slider{
margin: 0 auto 20px;
}
}
/*共通要素*/
/*共通 flexboxタグ
-----------------------------------------------------------*/
.flex{
display: flex;
flex-wrap: wrap;
}
.flexb{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.flexc{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media screen and (max-width: 768px) {
.blocksp{
display: block;
}
.flex-dir_column_reverse-sp{
flex-direction: column-reverse;
}
}
/*背景
-----------------------------------------------------------*/
.bk-gray-img{
/*background-color: #f6f8fb;*/
background: url(../img/bk-gray-img.jpg) no-repeat center / cover;
}
.bk-yelllow{
background-image: url(../img/bk-yellow-img.jpg);
}
/*a
-----------------------------------------------------------*/
a:hover{
opacity: .8;
}
/*zoom in
-----------------------------------------------------------*/
.zoomIn img{
transform: scale(1);
transition: .3s ease-in-out;/*移り変わる速さを変更したい場合はこの数値を変更*/
}
.zoomIn a:hover{
opacity: 1;
}
.zoomIn a:hover img{/*hoverした時の変化*/
transform: scale(1.1);/*拡大の値を変更したい場合はこの数値を変更*/
}
/* 画像のマスク */
.mask{
display: block;
line-height: 0;/*行の高さを0にする*/
overflow: hidden;/*拡大してはみ出る要素を隠す*/
}
/*その他装飾
-----------------------------------------------------------*/
.line-dashed{
border-bottom: 1px dashed #000;
}
.line-dashed-top{
border-top: 1px dashed #000;
}
.arrow-black-right::after{
content: '';
display: inline-block;
width: 10px;
height: 12px;
background-image: url(../img/icon_arrow-black-right.png);
background-size: contain;
vertical-align: middle;
margin-left: 7px;
}
.arrow-black-left::before{
content: '';
display: inline-block;
width: 10px;
height: 12px;
background-image: url(../img/icon_arrow-black-right.png);
background-size: contain;
/*vertical-align: middle;*/
margin-right: 7px;
}
.arrow-white-left::before{
content: '';
display: inline-block;
width: 8px;
height: 8px;
background-image: url(../img/icon_arrow-white-right.png);
background-size: contain;
margin-right: 7px;
}
.button__simple-square{
background: transparent;
border: 1px solid rgba(0,0,0,.2);
display: flex;
justify-content: center;
align-items: center;
font-size: 1.4rem;
width: 300px;
height: 50px;
}
@media screen and (max-width: 768px) {
.button__simple-square{
width: 230px;
height: 35px;
}
}
/*フェードイン
-----------------------------------------------------------*/
/* スクロールをしたら出現する要素にはじめに透過0を指定 */
.fadeUpTrigger{
opacity: 0;
}
/* 下から */
.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeUpAnime{
from {
opacity: 0;
transform: translateY(100px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* 右から */
.fadeRight{
animation-name:fadeRightAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeRightAnime{
from {
opacity: 0;
transform: translateX(100px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
/*text
-----------------------------------------------------------*/
.bold{
font-weight: bold;
}
.txtcenter{
text-align: center;
}
.txtright{
text-align: right;
}
.txtjustify{
text-align: justify;
}
.txtOrange{
color: #ea5413;
}
.txtBlue{
color: #0864b2;
}
.title-mincho{
font-family: 'Noto Serif JP', serif;
font-size: 3.0rem;
}
@media screen and (max-width: 768px) {
.title-mincho{
font-size: 2.4rem;
}
.txtleftsp{
text-align: left;
}
}
.blue-subtitle{
font-size: 1.4rem;
color: #0864b2;
}
@media screen and (max-width: 768px) {
.blue-subtitle{
font-size: 1.2rem;
}
}
/*font
-----------------------------------------------------------*/
.fz12{
font-size: 1.2rem;
}
.fz14{
font-size: 1.4rem;
}
.fz16{
font-size: 1.6rem;
}
.fz18{
font-size: 1.8rem;
}
.fz20{
font-size: 2.0rem;
}
.fz22{
font-size: 2.2rem;
}
.fz24{
font-size: 2.4rem;
}
.fz26{
font-size: 2.6rem;
}
.fz28{
font-size: 2.8rem;
}
.fz30{
font-size: 3.0rem;
}
.fz32{
font-size: 3.2rem;
}
.fz35{
font-size: 3.5rem;
}
.fz36{
font-size: 3.6rem;
}
.fz40{
font-size: 4.0rem;
}
.fz50{
font-size: 5.0rem;
}
.fw700{
font-weight: 700;
}
.fw400{
font-weight: 400;
}
.fw500{
font-weight: 500;
}
.fw600{
font-weight: 600;
}
.fw700{
font-weight: 700;
}
.lsplus10{
letter-spacing: 1px;
}
.lsminus05{
letter-spacing: -.5px;
}
.lsminus10{
letter-spacing: -1px;
}
.lsminus15{
letter-spacing: -1.5px;
}
.lsminus18{
letter-spacing: -1.8px;
}
.lsminus20{
letter-spacing: -2px;
}
.lsplus15{
letter-spacing: 1.5px;
}
.lh10{
line-height: 1.0;
}
.lh12{
line-height: 1.2;
}
.lh14{
line-height: 1.4;
}
.lh18{
line-height: 1.8;
}
.lh20{
line-height: 2.0;
}
.lh25{
line-height: 2.5;
}
.lh30{
line-height: 3.0;
}
@media screen and (max-width: 768px) {
.fz10sp{
font-size: 1.0rem;
}
.fz12sp{
font-size: 1.2rem;
}
.fz14sp{
font-size: 1.4rem;
}
.fz15sp{
font-size: 1.5rem;
}
.fz16sp{
font-size: 1.6rem;
}
.fz18sp{
font-size: 1.8rem;
}
.fz20sp{
font-size: 2.0rem;
}
.fz22sp{
font-size: 2.2rem;
}
.fz24sp{
font-size: 2.4rem;
}
.fz28sp{
font-size: 2.8rem;
}
.fz30sp{
font-size: 3.0rem;
}
.lh14sp{
line-height: 1.4;
}
.lh16sp{
line-height: 1.6;
}
.lsminus20sp{
letter-spacing: -2.0px;
}
.lsminus15sp{
letter-spacing: -1.5px;
}
.lsminus10sp{
letter-spacing: -1px;
}
}
/*mt mb 調整タグ
-----------------------------------------------------------*/
.mt10{
margin-top:10px;
}
.mt15{
margin-top:15px;
}
.mt20{
margin-top:20px;
}
.mt30{
margin-top:30px;
}
.mt40{
margin-top:40px;
}
.mt50{
margin-top:50px;
}
.mt60{
margin-top:60px;
}
.mt80{
margin-top:80px;
}
.mt100{
margin-top:100px;
}
.mb5{
margin-bottom:5px;
}
.mb10{
margin-bottom:10px;
}
.mb15{
margin-bottom:15px;
}
.mb20{
margin-bottom: 20px;
}
.mb30{
margin-bottom: 30px;
}
.mb40{
margin-bottom: 40px;
}
.mb50{
margin-bottom:50px;
}
.mb60{
margin-bottom:60px;
}
.mb70{
margin-bottom: 70px;
}
.mb80{
margin-bottom: 80px;
}
.mb100{
margin-bottom: 100px;
}
.mb120{
margin-bottom: 120px;
}
.mb130{
margin-bottom: 130px;
}
.mb160{
margin-bottom: 160px;
}
.mb200{
margin-bottom: 200px;
}
.ml0{
margin-left:0;
}
.ml10{
margin-left: 10px;
}
.ml20{
margin-left: 20px;
}
.ml30{
margin-left: 30px;
}
.ml40{
margin-left: 40px;
}
.ml50{
margin-left: 50px;
}
.mr10{
margin-right: 10px;
}
.mr20{
margin-right: 20px;
}
.mr30{
margin-right: 30px;
}
.pt25{
padding-top: 25px;
}
.pt40{
padding-top: 40px;
}
.pt50{
padding-top: 50px;
}
.pt60{
padding-top: 60px;
}
.pt70{
padding-top: 70px;
}
.pt80{
padding-top: 80px;
}
.pt100{
padding-top: 100px;
}
.pt150{
padding-top: 150px;
}
.pb10{
padding-bottom: 10px;
}
.wrapppb20{
padding-bottom: 20px;
}
.pb20{
padding-bottom: 20px;
}
.pb25{
padding-bottom: 25px;
}
.pb30{
padding-bottom: 30px;
}
.pb40{
padding-bottom: 40px;
}
.pb50{
padding-bottom: 50px;
}
.pb60{
padding-bottom: 60px;
}
.pb80{
padding-bottom: 80px;
}
.pb90{
padding-bottom: 90px;
}
.pb100{
padding-bottom: 100px;
}
.pb120{
padding-bottom: 120px;
}
.pb130{
padding-bottom: 130px;
}
.pb150{
padding-bottom: 150px;
}
.pl5{
padding-left: 5px;
}
.pl10{
padding-left: 10px;
}
.pl30{
padding-left: 30px;
}
.pl20{
padding-left: 20px;
}
.pl50{
padding-left:50px;
}
.pl60{
padding-left:60px;
}
.pl70{
padding-left:70px;
}
.pl25{
padding-left: 25px;
}
.pl110{
padding-left: 110px;
}
.pr30{
padding-right: 30px;
}
.pr70{
padding-right: 70px;
}
@media screen and (max-width: 768px) {
/*margin*/
.mt15{
margin-top:10px;
}
.mt30{
margin-top:15px;
}
.mt40{
margin-top:20px;
}
.mt50{
margin-top:25px;
}
.mt60{
margin-top:30px;
}
.mt80{
margin-top:40px;
}
.mt100{
margin-top:50px;
}
.mb10{
margin-bottom:5px;
}
.mb15{
margin-bottom:10px;
}
.mb20{
margin-bottom: 10px;
}
.mb30{
margin-bottom: 15px;
}
.mb40{
margin-bottom: 20px;
}
.mb50{
margin-bottom:25px;
}
.mb60{
margin-bottom:30px;
}
.mb70{
margin-bottom: 35px;
}
.mb80{
margin-bottom: 40px;
}
.mb100{
margin-bottom: 50px;
}
.mb120{
margin-bottom: 60px;
}
.mb130{
margin-bottom: 65px;
}
.mb160{
margin-bottom: 80px;
}
/*sp調整タグ*/
.mb05sp{
margin-bottom: 5px;
}
.mb10sp{
margin-bottom: 10px;
}
.mb25sp{
margin-bottom: 25px;
}
.mb50sp{
margin-bottom: 50px;
}
.mt30sp{
margin-top: 30px;
}
.mt60sp{
margin-top: 60px;
}
.minwidth90{
min-width: 90px;
}
/*padding*/
.pt25{
padding-top: 15px;
}
.pt40{
padding-top: 20px;
}
.pt50{
padding-top: 25px;
}
.pt60{
padding-top: 30px;
}
.pt70{
padding-top: 35px;
}
.pt80{
padding-top: 40px;
}
.pt100{
padding-top: 50px;
}
.pt150{
padding-top: 75px;
}
.pb20{
padding-bottom: 10px;
}
.pb25{
padding-bottom: 13px;
}
.pb30{
padding-bottom: 15px;
}
.pb40{
padding-bottom: 20px;
}
.pb50{
padding-bottom: 25px;
}
.pb60{
padding-bottom: 30px;
}
.pb80{
padding-bottom: 40px;
}
.pb90{
padding-bottom: 45px;
}
.pb100{
padding-bottom: 50px;
}
.pb120{
padding-bottom: 60px;
}
.pb130{
padding-bottom: 75px;
}
.pb150{
padding-bottom: 75px;
}
/*sp調整タグ*/
.pt25sp{
padding-top: 25px;
}
.pb25sp{
padding-bottom: 25px;
}
.pl30{
padding-left: 15px;
}
.pr30{
padding-right: 15px;
}
.pl20sp{
padding-left: 20px;
}
/*marigin-left sp調整*/
.ml0sp{
margin-left:0;
}
.pl0sp{
padding-left: 0;
}
/*width sp100%*/
.w100sp{
width: 100%;
height: auto;
}
}
/*スマホメニュー
-----------------------------------------------------------------*/
@media screen and (max-width: 768px) {
#spnavi{
display: none;
position: absolute;
top:60px;
width: 100%;
background: #fff;
left: 0;
z-index:90;
padding: 5px 0 30px;
}
#spnavi > ul{
display: block;
margin: 0 auto;
width: 95%;
}
#spnavi > ul > li{
margin: 0 auto;
text-indent:10px;
padding: 5px 0;
}
#spnavi > ul > li > a{
display: block;
padding:3px 0;
font-size:1.4rem;
text-decoration: none;
font-family:'ZenOldMincho-Bold';
font-weight: 500;
}
#spnavi > ul > li > a::before{
display: inline-block;
content: "";
width: 20px;
height: 20px;
vertical-align: -5px;
background: url(../img/icon-circle-arrow___red.png) no-repeat center / contain;
margin-right: 10px;
}
#spnavi > ul > li > ul > li > a{
display: block;
color:#555555 !important;
padding:3px 0 3px 20px;
font-size:1.4rem;
text-decoration: none;
}
#spnavi > ul li a:hover{
text-decoration:none;
opacity:.7;
}
#spnavi h1 > a > img{
width: 80px;
height: auto;
}
/*開閉ボタン*/
#nav_toggle{
display: block;
width: 30px;
height: 20px;
position:absolute;
top: 16px;
/*top:35px;*/
right:20px;
z-index: 100;
text-align: center;
}
#nav_toggle div {
position: relative;
}
#nav_toggle span{
display: block;
height: 2px;
background: #3575bd;
position:absolute;
width: 100%;
left: 0;
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
}
.top-page #nav_toggle span{
background: #3575bd;
}
#nav_toggle span:nth-child(1){
top:0px;
}
#nav_toggle span:nth-child(2){
top:8px;
}
#nav_toggle span:nth-child(3){
top:16px;
}
#nav_toggle p.togglemenu{
background:none;
color:#3575bd;
font-size:8px;
padding-top:19px;
}
/*開閉ボタンopen時*/
.open #nav_toggle span:nth-child(1) {
top: 8px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
transform: rotate(135deg);
background: #3575bd;
}
.open #nav_toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav_toggle span:nth-child(3) {
top: 8px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
transform: rotate(-135deg);
background: #3575bd;
}
.header-companylogo_sp{
position:absolute;
top:20px;
left:10px;
z-index:99;
/*top:-27px;
right:-10px;*/
}
.spnavi-arrow:before{
content: '';/*何も入れない*/
display: inline-block;/*忘れずに！*/
width: 10px;/*画像の幅*/
height: 10px;/*画像の高さ*/
background-image: url(../img/spnavi-arrow.png);
background-size: contain;
/*vertical-align: middle;*/
margin-right:5px;
}
}
/*スマホメニュー終わり
-----------------------------------------------------------------*/
/*pconly sponly切り替え スマホtel処理
-----------------------------------------------------------*/
@media screen and (min-width: 1024px) {
.w1024only{
display: none;
}
}
@media screen and (max-width: 1024px) {
.w1024only{
display: block;
position:relative;
z-index: 2;
}
}
@media screen and (min-width: 769px) {
.sponly{
display: none;
}
}
@media screen and (max-width: 768px) {
.pconly{
display: none;
}
.sponly{
display: block;
position:relative;
/*z-index: 2;*/
}
/*a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}*/
}