@charset "utf-8";

/*=====================================

style.css

=====================================*/
body.hidden{
    overflow: hidden;
}
/*-------------------------------------
 top
-------------------------------------*/


/* opening animation */
.openingCopy{
    background-color: #E60012;
    color: #FFF;
    width: 100vw;
    height: 100vh;
    position: fixed;
    z-index: 1000001;
    display: flex;
    align-items: center;
    justify-content: center;
    /* display: none; */
}
.openingCopy p{
    font-size: 4rem;
    font-weight: bold;
    letter-spacing: 2px;
}


.openingCopy p span {
	color: transparent;
	animation: blur 5s ease-out;
	-webkit-animation: blur 5s ease-out;
}
.openingCopy p span:nth-child(1) {
	animation-delay: 0.1s;
}
.openingCopy p span:nth-child(2) {
	animation-delay: 0.2s;
}
.openingCopy p span:nth-child(3) {
	animation-delay: 0.3s;
}
.openingCopy p span:nth-child(4) {
	animation-delay: 0.4s;
}
.openingCopy p span:nth-child(5) {
	animation-delay: 0.5s;
}
.openingCopy p span:nth-child(6) {
	animation-delay: 0.6s;
}
.openingCopy p span:nth-child(7) {
	animation-delay: 0.7s;
}
.openingCopy p span:nth-child(8) {
	animation-delay: 0.8s;
}
.openingCopy p span:nth-child(9) {
	animation-delay: 0.9s;
}
.openingCopy p span:nth-child(10) {
	animation-delay: 1s;
}
.openingCopy p span:nth-child(11) {
	animation-delay: 1.1s;
}
.openingCopy p span:nth-child(12) {
	animation-delay: 1.2s;
}
.openingCopy p span:nth-child(13) {
	animation-delay: 1.3s;
}
.openingCopy p span:nth-child(14) {
	animation-delay: 1.4s;
}
.openingCopy p span:nth-child(15) {
	animation-delay: 1.5s;
}
.openingCopy p span:nth-child(16) {
	animation-delay: 1.6s;
}
@keyframes blur {
	0%		{text-shadow:  0 0 20px #fff; opacity:0;}
	3%		{text-shadow:  0 0 140px #fff;}
	10%		{opacity: 1;}
	20%		{text-shadow:  0 0 0px #fff;}
	80%		{text-shadow:  0 0 0px #fff;}
	85%		{opacity: 1;}
	98%		{text-shadow:  0 0 140px #fff;}
	100%	{text-shadow:  0 0 200px #fff; opacity:0;}
}


/* opening animation END */



.topMaskMovie {
    mask-repeat: no-repeat;
    mask-position: 0 0;
    mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: 0 0;
    -webkit-mask-size: 100%;
    -webkit-mask-image: url(../images/linkit.svg);
    mask-image: url(../images/linkit.svg);
    width: 50%;
    right: -45px;
    position: absolute;
    top: 12vh;
    z-index: 1;
}

.topMaskMovie02 {
    mask-repeat: no-repeat;
    mask-position: 0 0;
    mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: 0 0;
    -webkit-mask-size: 100%;
    -webkit-mask-image: url(../images/linkit02.svg);
    mask-image: url(../images/linkit02.svg);
    width: 50%;
    right: -45px;
    position: absolute;
    top: 8vh;
}
.topMaskMovie02 video {
    opacity: 1;
    height: auto;
    width: 195%;
    position: relative;
    left: -49%;
    top: -34px;
}
.topMaskMovie video {
    opacity: 1;
    height: auto;
    width: 198%;
    position: relative;
    left: -43%;
}

.mainText {
    
    position: absolute;
    top: 40%;
    left: 27%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    font-size: 3em;
    font-weight: 900;
    text-align: left;
    color: #E60012;
}

.topNewsPickWrapper {
    padding: 30px 0;
    background-color: #000;
    width: 63%;
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: left;
}
.topNewsPickWrapper .inner{
    margin-left: calc( (100vw - 1200px) / 2 );
}

.topNewsPickWrapper time{
    color: #fff;
}

.topNewsPickWrapper h2 {
    display: block;
    font-size: 1.5rem;
    margin-right: 30px;
    float: none;
    font-weight: normal;
    color: #fff;
    padding-left: 80px;
    box-sizing: border-box;
    position: relative;
    margin-bottom: 5px;
}
.topNewsPickWrapper h2:last-child{
    margin-bottom: 0;
}
.topNewsPickWrapper h2::before {
    content: '';
    width: 70px;
    height: 1px;
    background-color: #FFF;
    position: absolute;
    left: 0;
    top: 13px;
}
.topNewsPickWrapper a{
    color: #fff;
}
.topNewsPickWrapper p{
    overflow: hidden;
    display: block;
    color: #333;
    margin-left: 86px;
    padding-top: 0px;
    padding-left: 40px;
    background-image: url(../images/ico_bikkuri_blue.svg);
    background-repeat: no-repeat;
    background-position: left center;
}

.topNewsPickWrapper p a{
    color: #333;
    display: inline-block;

}


.miniCateTitle{
    float: right;
}
.miniCateTitle h2{
    display: inline-block;
    border-bottom: 1px #000 solid;
    padding-bottom: 10px;
}
.obiTitle{
    position: absolute;
    z-index: 0;
    width: 600px;
    height: 400px;
}
.obiTitle.right{
    right: 0;
}
.obiTitle h2 {
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
    font-size: 6rem;
    margin-top: -50px;
    margin-left: 8%;
    position: absolute;
}

.topBussinessContents2c {
    position: relative;
    z-index: 1;
    padding-left: calc( ( 100vw - 1200px) / 2 );
    padding-right: calc( (100vw - 1200px) / 2 );
    margin-left: auto;
    margin-right: auto;
    padding-top: 80px;
    display: grid;
    grid-template-columns: 48% 46%;
    column-gap: 6%;
}

.topBusinessIntegration2c .inner{
    display: grid;
    grid-template-columns: 48% 48%;
    column-gap: 4%;
}
.topBusinessIntegration2c h2{
    text-align: center;
    font-size: 6rem;
    margin-bottom: 20px;
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
}
.topBusinessIntegrationUnit{
    z-index: 1;
    position: relative;
}
.topBusinessIntegrationUnit h3{
    margin-top: 40px;
    margin-bottom: 10px;
    font-size: 4rem;
    color: #000;
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
}
.topBusinessIntegrationUnit h3.right{
    text-align: right;
}
.textBox{
    position: relative;
}
.topBussinessContents2c .imgBox{
    position: relative;
}
.topBussinessContents2c .hikkiTitle {
    position: absolute;
    top: -130px;
    right: -350px;
    z-index: 1;
}
.topBussinessContents2c {
    margin-bottom: 80px;
}

.topBussinessContents2c h3{
    font-size: 2.8rem;
    margin-bottom: 40px;
}
.topBussinessContents2c p{
    line-height: 2;
    margin-bottom: 20px;
}
.topBussinessContents2c .textBox{
    padding-top: 80px;
    margin-bottom: 30px;
}
.topSection {
    position: relative;
    padding-top: 90px;
    padding-bottom: 140px;
    background-color: #FFF;
}

.viewDetailsBtn {
    margin-bottom: 20px;
}
.viewDetailsBtn a{
    font-size: 2.6rem;
    font-weight: bold;
    display: inline-block;
    position: relative;
    font-family: "din-2014", sans-serif;
    letter-spacing: 2px;
}
.viewDetailsBtn a:hover{
    text-decoration: none;
}
.viewDetailsBtn a::after{
    width: 100%;
    height: 3px;
    background-color: #000;
    position: absolute;
    bottom: -5px;
    content: '';
    left: 0;
}

.topMainSlide {
    width: 155%;
    left: -48%;
    position: relative;
    margin-top: 0;
    top: 0;
}
.slick-slide img{
    transform: scale(1.1);
}
.slick-slide.slick-active img{
    transform: scale(1);
    width: 100%;
    animation: zoomUp 4.5s;
    animation-iteration-count: 1;
    animation-timing-function:ease;
}
@keyframes zoomUp {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.1); /* 拡大率 */
    }
}




.topBussinessUnit h3{
    font-size: 3rem;
    text-align: center;
    margin-bottom: 60px;
    font-family: "din-2014", sans-serif;
}

.topBussinessUnit h4{
    font-weight: normal;
}

.topBussinessUnit4c ul{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 90px;
    z-index: 2;
    position: relative;
}
.topBussinessUnit4c h4 {
    text-align: center;
    margin-top: 8px;
    font-size: 1.85rem;
    font-weight: bold;
}
.topBussinessUnit{
    padding-left: 100px;
    padding-right: 100px;
    position: relative;
}
  

.marqueeWrapper p {
    margin-inline: auto;
    /* max-width: 50%; */
    overflow: clip;
    font-size: 9rem;
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
    font-weight: bold;
}

.container {
    overflow: hidden;
    width: 100%;
    height: 70px;
}
   
.marqueeWrapper {
    overflow: hidden;
    position: absolute;
    width: 100vw;
    height: 180px;
    left: 0;
    top: calc(50% - 60px);
    width: fit-content;
    display: flex;
    width: 1830px;
}
   
.marqueeChild {
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: absolute;
    left: 0%;
    top: 0%;
    width: 100%;
    height: inherit;
    animation-duration: 18s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.marqueeChild:nth-child(1) {
    animation-name: first;
}
   
.marqueeChild:nth-child(2) {
    animation-name: second;
}
   
@keyframes first {
    from {
        left: 0%;
    }
    to {
        left: -100%;
    }
}
@keyframes second {
    from {
        left: 100%;
    }
    to {
        left: 0%;
    }
}

.topCompanyContents {
    background-color: #000;
    padding-right: calc( ( 100vw - 1200px) / 2 );
    margin-bottom: 100px;
    padding-left: 12%;
    padding-top: 12%;
    padding-bottom: 12%;
}

.topCompanyContents h3{
    font-size: 2.6rem;
    margin-bottom: 40px;
    color: #FFF;
}
.topCompanyContents p{
    line-height: 2;
    margin-bottom: 20px;
    color: #FFF;
}
.miniCateTitle.topBusinessIntegration{
    margin-bottom: -30px;
}
.topCompanyContents .miniCateTitle{
    color: #fff;
}
.topCompanyContents .miniCateTitle h2{
    display: inline-block;
    border-bottom: 1px #FFF solid;
    padding-bottom: 10px;
}
.topCompany .obiTitle{
    margin-top: 100px;
}
.topCompany .hikkiTitle {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: -160px;
    mix-blend-mode: difference;
    z-index: 3;
}
.topCompany2c{
    display: grid;
    grid-template-columns: 1fr 1fr;
    z-index: 2;
    position: relative;
}
.topCompany2c .imgBox{
    margin-top: 200px;
}
.topCompanyContents .viewDetailsBtn a{
    color: #FFF;
}
.topCompany2c .viewDetailsBtn a::after{
    background-color: #FFF;
}

.topRecruitContents{
    padding-left: calc( ( 100vw - 1200px) / 2 );
}


.topRecruitContents {
    background-color: #000;
    margin-left: calc( ( 100vw - 1200px) / 2 );
    margin-bottom: 0;
    padding-left: 4%;
    padding-top: 4%;
    padding-bottom: 4%;
    padding-right: 4%;
    z-index: 2;
    position: relative;
}
.topRecruitContents h3{
    font-size: 2.8rem;
    margin-bottom: 40px;
    color: #FFF;
}
.topRecruitContents p{
    line-height: 2;
    margin-bottom: 20px;
    color: #FFF;
}
.topRecruitContents .viewDetailsBtn a{
    color: #FFF;
}
.topRecruitContents .viewDetailsBtn a::after{
    background-color: #FFF;
}
.topRecruitContents{
    width: 50%;
}
.topRecruit2c{
    margin-top: 60px;
}
.topRecruit2c .imgBox {
    width: 60%;
    margin-top: -100px;
    margin-left: auto;
    z-index: 3;
    position: relative;
}
.topRecruit .hikkiTitle {
    position: absolute;
    left: 51%;
    right: auto;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: -70px;
    mix-blend-mode: difference;
    z-index: 3;
}

.topTopics .obiTitle {
    position: absolute;
    z-index: 0;
    width: 30%;
    height: calc(100% + 110px);
    right: 0;
    margin-top: -110px;
}
.topTopics .miniCateTitle{
    float: left;
    margin-top: -100px;
}
.topTopics .obiTitle h2 {
    margin-left: -40%;
}

.topTopics .viewDetailsBtn{
    text-align: center;
}
.topPickupWrapper .more {
    position: absolute;
    right: 20px;
    bottom: 15px;
    font-weight: bold;
}

.topInformation .obiTitle {
    height: calc(100% - 220px);
    top: 220px;
}
.topInfomationContents {
    background-color: #000;
    padding-right: calc( ( 100vw - 1200px) / 2 );
    padding-left: 4%;
    padding-top: 4%;
    padding-bottom: 4%;
    z-index: 1;
    position: relative;
    margin-left: calc( ( 100vw - 1200px) / 2 );
}
.topInfomationContents h2{
    font-family: 'Filson Pro', "Helvetica Neue", "Helvetica";
    font-size: 6rem;
    color: #fff;
}
.topInfomationContents .miniCateTitle h2 {
    font-size: 1.4rem;
    display: inline-block;
    border-bottom: 1px #FFF solid;
    padding-bottom: 10px;
}
.topInfomationContents .viewDetailsBtn{
    text-align: right;
    color: #FFF;
}
.topInfomationContents .viewDetailsBtn a{
    border-bottom: solid 3px #FFF;
    color: #FFF;
}
.textLinkList{
    margin-bottom: 60px;
}

.textLinkList dt{
    padding-left: 30px;
    margin-bottom: 10px;
    padding-right: 30px;
    color: #FFF;
}
.textLinkList dt label{
    background-color: #FCE03D;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 30px;
    padding-right: 30px;
    font-size: 1.2rem;
}
.textLinkList dd{
    border-bottom: solid 1px #F9F9F9;
    padding-bottom: 20px;
    margin-bottom: 20px;
    padding-left: 30px;
    padding-right: 30px;
}

.textLinkList dd:last-child{
    margin-bottom: 0;
    border-bottom: none;
}
.textLinkList dl:first-child{
    border-top: solid 1px #F9F9F9;
    padding-top: 20px;
}
.textLinkList dl:first-child dd {
    border-bottom: solid 1px #F9F9F9;
    color: #FFF;
}
.textLinkList a{
    padding-left: 30px;
    background-image: url(../images/ico_arrow_white_mini.svg);
    background-position: left 7px center;
    background-repeat: no-repeat;
    display: block;
    color: #FFF;
}


.pickupList{
    margin-bottom: 40px;
}
.pickupList div.slide{
    display: block;
}
.pickupList div.slide .slick-slide {
    margin-left: 3px;
    margin-right: 3px;
}
.pickupList div.slide div.slideContents {
    background-color: #FFFFFF;
    padding: 25px 25px 55px 25px;
    box-sizing: border-box;
    border-radius: 0px;
    box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.05);
    min-height: 388px;
}
.pickupList div.slide div.slideContents  .dateText{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 7px 25px;
    background-color: #f9f9f9;
    color: #777;
}

.pickupList div.slide div.slideContents .imgBox {
    margin-bottom: 15px;
    border-radius: 0;
    overflow: hidden;
    margin-left: -25px;
    margin-right: -25px;
    margin-top: -25px;
}
.pickupList div.slide div.slideContents .imgBox img {
    width: 100%;
    object-fit: cover;
    max-height: 200px;
}

.topPickupWrapper .swiper-button-prev{
    position: absolute;
    z-index: 2;
    left: -10px;
    top: calc(50% - 40px);
    font-size: 0;
    background-image: url(../images/prev.svg);
    width: 40px;
    height: 84px;
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.9;
}
.topPickupWrapper .swiper-button-next{
    position: absolute;
    z-index: 2;
    right: -10px;
    top: calc(50% - 40px);
    font-size: 0;
    background-image: url(../images/next.svg);
    width: 40px;
    height: 84px;
    cursor: pointer;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.9;
}
.swiper-button-next::after, .swiper-button-prev::after{
    display: none;
}
.swiper-button-next::before, .swiper-button-prev::before{
    display: none;
}
.swiper{
    overflow: visible;
}
.topPickupWrapper .swiper-button-next.swiper-button-disabled,
.topPickupWrapper .swiper-button-prev.swiper-button-disabled{
    opacity: 0;
}

p.leadC{
    text-align: center;
    margin-bottom: 40px;
}
.pickupList h3 {
    margin-bottom: 15px;
    min-height: 3.5em;
}


.pickupList .link{
    text-align: center;
}
.pickupList .link a{
    display: inline-block;
    border:  solid 1px #E60012;
    padding: 10px 40px;
    min-width: 210px;
    box-sizing: border-box;
    text-align: center;
    background-image: url(../images/ico_arrow_blue.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
}

/*-------------------------------------
 detail
-------------------------------------*/


article{
    margin-bottom: 120px;
    background-color: #FFF;
    padding: 4%;
}
pre {
    all: inherit;
    text-align: left;
    color: #000;
}

.detailMainImg{
    text-align: center;
    margin-bottom: 30px;
}
.detailMainImg img{
    width: 100%;
    height: auto;
}

.articleTitle{
    margin-bottom: 20px;
    padding-top: 67px;
    text-align: center;
    position: relative;
}
.articleTitle h1{
    padding-left: 15px;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    font-size: 2.2rem;
    background-repeat: no-repeat;
    position: relative;
}
.articleTitle h1::after{
    height: 2px;
    background-color: #E60012;
    width: 50px;
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    bottom: 0;
}

.articleBody section{
    margin-bottom: 60px;
    position: relative;
}
.articleBody a{
    text-decoration: underline;
}
.articleBody a:hover{
    text-decoration: none;
}
.articleBody .leadTxt{
    margin-bottom: 30px;
}
.articleBody .leadTxt p{
    font-weight: bold;
    font-size: 2.4rem;
    text-align: center;
    background-color: #f9f9f9;
    padding: 6%;
}

.articleBody p {
    line-height: 1.9;
    text-align: justify;
    margin-bottom: 20px;
    font-size: 1.6rem;
    margin-left: 15px;
    margin-right: 15px;
}

.articleBody table p{
    font-size: inherit;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    line-height: inherit;
    margin-bottom: 13px;
}
.articleBody table p:last-child{
    margin-bottom: 0;
}
.textContents::after{
    display: block;
    content: '';
    clear: both;
}
.textContents{
    margin-left: 15px;
    margin-right: 15px;
}
.articleBody h1{
    font-size: 3.2rem;
    padding-left: 40px;
    position: relative;
}
.articleBody h1::before {
    content: '';
    width: 15px;
    height: 15px;
    background-color: #E60012;
    border-radius: 100px;
    top: 21px;
    left: 0;
    position: absolute;
}
.articleBody .imgBoxL{
    float: left;
    max-width: 40%;
    margin-bottom: 20px;
    margin-right: 30px;
}
.articleBody .imgBoxR{
    float: right;
    max-width: 40%;
    margin-bottom: 20px;
    margin-left: 30px;
}
.articleBody .imgBoxC{
    max-width: 100%;
    margin-bottom: 30px;
}
.articleBody h2 {
    padding-left: 100px;
    font-size: 2.2rem;
    margin-bottom: 20px;
    font-weight: bold;
    position: relative;
}
.articleBody h2::before{
    width: 70px;
    height: 3px;
    content: '';
    display: block;
    position: absolute;
    top: 19px;
    left: 0;
    background-color: #E60012;
}
.articleBody h3{
    padding: 8px 20px;
    font-size: 1.8rem;
    margin-bottom: 30px;
    font-weight: bold;
    background-color: #F9F9F9;
    text-align: left;
}
.articleBody dl{
    line-height: 1.9;
    text-align: justify;
    margin-bottom: 20px;
    font-size: 1.6rem;
    margin-left: 15px;
    margin-right: 15px;
}
.articleBody dl::after{
    display: block;
    content: '';
    clear: both;
}
.articleBody dl dt{
    float: left;
    min-width: 120px;
    margin-right: 20px;
}
.articleBody dl dd{
    margin-left: 145px;
    border-left: 5px #dcdcdc solid;
    padding-left: 20px;
}
.articleBody h4 {
    padding-top: 0;
    padding-bottom: 8px;
    padding-left: 10px;
    font-size: 1.6rem;
    margin-bottom: 30px;
    font-weight: bold;
    border-bottom: #dcdcdc solid 1px;
    margin-left: 15px;
    margin-right: 15px;
    text-align: left;
}
.articleBody ul li{
    margin-bottom: 15px;
    position: relative;
    padding-left: 25px;
}
.articleBody ul li::before {
    content: '';
    width: 8px;
    height: 8px;
    background-color: #dcdcdc;
    transform: rotate(45deg);
    position: absolute;
    left: 4px;
    top: 10px;
}
.articleBody ul{
    margin-bottom: 20px;
    position: relative;
    padding-left: 25px;
    font-size: 1.6rem;
}
.articleBody ol{
    margin-bottom: 20px;
    position: relative;
    padding-left: 40px;
}
.articleBody ol li{
    margin-bottom: 15px;
    position: relative;
    padding-left: 11px;
    list-style-type: decimal;
    font-size: 1.6rem;
}
.tableBox{
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 20px;
}
.tableScrollBox{
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 20px;
}
.mrgT20{
    margin-top: 20px;
}
table{
    width: -webkit-fill-available;
    margin-left: 15px;
    margin-right: 15px;
}
table thead,
table tbody,
table tr,
table th,
table td{
    border-collapse: collapse;
}
table th,
table td{
    border: solid 1px #dcdcdc;
    padding: 10px;
}
table th {
    font-weight: bold;
    background-color: #F9F9F9;
    text-align: left;
}
table td table{
    border: none;
    margin-left: 0;
}
table td table td{
    border: none;
    padding: 5px;
}
table td table th {
    border: none;
    width: 200px;
}
.articleBody ul li a{
    display: inline-block;
    
}
.articleBody ul li a.blank{
    background-image: url(../images/ico_blank.svg);
    padding-right: 30px;
    background-position: right center;
    background-repeat: no-repeat;
}
.articleBody ul li a.pdf{
    background-image: url(../images/ico_pdf.svg);
    padding-right: 30px;
    background-position: right center;
    background-repeat: no-repeat;
}
.articleBody ul li a.word{
    background-image: url(../images/ico_word.svg);
    padding-right: 30px;
    background-position: right center;
    background-repeat: no-repeat;
}
.articleBody ul li a.excel{
    background-image: url(../images/ico_excel.svg);
    padding-right: 30px;
    background-position: right center;
    background-repeat: no-repeat;
}
.articleBody ul li img.icon{
    display: inline-block;
    margin-left: 8px;
    vertical-align: text-bottom;
    height: 20px;
    padding-bottom: 1px;
}


.articleBody .accordionBox h2 {
    margin-left: 0;
    font-size: 2.8rem;
    padding-left: 80px;
}
.articleBody .accordionBox h2::before {
    width: 50px;
    height: 3px;
    top: 23px;
}
.articleBody .accordionBox h2.btn{
    background-image: url(../images/plus.svg);
    background-repeat: no-repeat;
    background-position: right center;
    cursor: pointer;
    padding-right: 50px;
}
.articleBody .accordionBox h2.btn.open{
    background-image: url(../images/minus.svg);
}
.articleBody .accordionBox h3.btn{
    background-image: url(../images/plus.svg);
    background-repeat: no-repeat;
    background-position: right center;
    cursor: pointer;
    padding-right: 50px;
    margin-bottom: 23px;
}
.articleBody .accordionBox h3.btn.open{
    background-image: url(../images/minus.svg);
}

.articleBody .accordionBox h3{
    font-size: 2.2rem;
}
.articleBody .accordionBox h4 {
    font-size: 1.8rem;
}
.accordionBox{
    background-color: #F9F9F9;
    padding: 20px 30px 1px 20px;
    margin-bottom: 60px;
}
.articleBody .accordionBoxInner{
    background-color: #FFFFFF;
    display: none;
    padding: 20px;
    margin-bottom: 20px;
}
.articleBody .accordionBoxInner section{
    margin-bottom: 40px;
}
.articleBody .accordionBoxInner section:last-child{
    margin-bottom: 0;
}
.articleBtn {
    text-align: center;
    margin-top: 30px;
}
.articleBtn a{
    display: inline-block;
    padding: 10px 40px;
    min-width: 400px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #E60012;
    border-radius: 100px;
    color: #FFFFFF;
    margin-bottom: 20px;
}
.articleBtn a:hover{
    text-decoration: none;
}

/* Other TPL for article */

.articleBody .informationBox,
.articleBody .eventBox{
    float: none;
}

.articleBody .informationBox h2,
.articleBody .eventBox h2{
    font-size: 2.6rem;
    font-weight: bold;
    position: relative;
    margin-bottom: 15px;
    padding-left: 44px;
}

.articleBody .informationBox h2::before,
.articleBody .eventBox h2::before{
    display: none;
}

.articleBody .informationBox h2 span,
.articleBody .eventBox h2 span {
    display: inline-block;
    padding: 5px 20px;
    background-color: #FFFFFF;
    position: absolute;
    right: 0;
    font-size: 1.6rem;
    font-weight: normal;
    top: 2px;
}
.articleInfoBox2c{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 2px;
}
.articleInfoBox1c + .articleInfoBox2c{
    margin-top: 2px;
}
.articleInfoBox2c + .articleInfoBox1c{
    margin-top: 2px;
}

.informationBox.noHeightFix .textLinkList, .eventBox.noHeightFix .textLinkList {
    height: auto;
}

.articleLinkContentsBox{
    display: grid;
    grid-template-columns: 48% 48%;
    column-gap: 4%;
    row-gap: 30px;
}
.articleLinkContentsBox .big {
    grid-column: span 2;
}
.articleBody .topLinkBox ul li {
    margin-bottom: 8px;
    position: relative;
    padding-left: 0;
}

.articleBody .topLinkBox  ul li::before{
    display: none;
}

.articleBody .topLinkBox  ul {
    padding-left: 0;
}

.articleBody .topLinkBox h2 {
    font-size: 2rem;
    font-weight: bold;
    padding-left: 30px;
    position: relative;
    margin-bottom: 15px;
}

.articleBody .topLinkBox h2::before {
    width: 20px;
    height: 3px;
    background-color: #E60012;
    position: absolute;
    content: '';
    top: 16px;
    left: 0;
}
.mapBox01 iframe {
    width: 100%;
}


/* pc 2-3 column imgs */
.articleBody .gallery2c {
    margin-left: 15px;
    margin-right: 15px;
}
.articleBody .gallery2c{
    display: grid;
    grid-template-columns: 49% 49%;
    column-gap: 2%;
    row-gap: calc(1170px / 50);
    margin-bottom: 30px;
}
.articleBody .gallery2c .imgBox{
    margin-bottom: 10px;
    font-size: 1.2rem;
}
.articleBody ul.gallery2c {
    margin: 0;
    padding: 0;
}
.articleBody ul.gallery2c li{
    list-style: none;
    padding-left: 0;
}
.articleBody ul.gallery2c li::before{
    display: none;
}
.articleBody .gallery3c {
    margin-left: 15px;
    margin-right: 15px;
}
.articleBody .gallery3c{
    display: grid;
    grid-template-columns: 32% 32% 32%;
    column-gap: 2%;
    row-gap: calc(1170px / 50);
    margin-bottom: 30px;
}
.articleBody .gallery3c .imgBox{
    margin-bottom: 10px;
    font-size: 1.2rem;
}
.footerPdfDlBtn{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    margin-bottom: 25px;
}
.footerContect {
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
}

.footerContect{
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    background-color: #fdfdfd;
}
.footerContect h2 {
    text-align: center;
    font-size: 24px;
    margin-bottom: 15px;
}
.footerContect p{
    text-align: center;
}
.footerContect .fotterContactBtn{
    padding-top: 20px;
    padding-bottom: 20px;
    box-sizing: content-box;
}
.footerContect .fotterContactBtn a {
    font-size: 18px;
    padding-left: 100px;
    padding-right: 100px;
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
    box-sizing: border-box;
    border: #E60012 solid 2px;
    background-color: #FFFFFF;
    color: #E60012;
    border-radius: 100px;
    display: inline-block;
}
.footerContect .fotterContactBtn a:hover{
    text-decoration: none;
}


.footerGroupInfo{
    border-top: #f9f9f9 solid 5px;
    padding-top: 80px;
    padding-bottom: 80px;
}
.topBussinessUnit h3 {
    font-size: 3rem;
    text-align: center;
    margin-bottom: 60px;
    font-family: "din-2014", sans-serif;
}
.footerBanner{
    padding-top: 80px;
    padding-bottom: 80px;
    text-align: center;
    background-color: #f9f9f9;
}

.footerGroupInfo h3{
    font-size: 4rem;
    text-align: center;
    margin-bottom: 30px;
    font-family: 'Filson Pro';
}

.footerGroupInfo {
    text-align: center;
}
.footerGroupInfo img {
    width: 240px;
}
.footerGroupInfo .grouplogo{
    display: inline-block;
    margin-bottom: 30px;
}
.footerGroupInfo .imgBox{
    margin-bottom: 10px;
}
.footerGroupInfo .p{
    text-align: center;

}
.groupCompaniesList ul {
    display: flex;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 8%;
    background-color: #f9f9f9;
    padding: 8%;
    align-items: center;
    justify-content: center;
}
.groupCompaniesList ul li{
    padding: 5%;
    text-align: center;
    background-color: #FFF;
}


/* ----- * CONTACT * ------*/
.contacrPrivacyBox{
    border: #C4C4C4 solid 1px;
    border-radius: 8px;
    padding: 4%;
    margin-bottom: 30px;
}
.contacrPrivacyBox h3{
    text-align: center;
    margin-bottom: 20px;
}
.contactBox .contacrPrivacyBox p{
    text-align: left;
    margin-bottom: 0;
}
.inputPrivacy{
    text-align: center;
}
/*
.contactBox .contacrPrivacyBox p{
    text-align: left;
}*/
.inputPrivacy a{
    text-decoration: underline;
}
.inputPrivacy a:hover{
    text-decoration: none;
}
.inputPrivacy{
    margin-top: 20px;
    margin-bottom: 20px;
}
input[type="checkbox"]{
    display: inline-block;
    -webkit-appearance: checkbox;
    margin-right: 5px;
}

input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], select, textarea, textarea.form-control {
    height: auto;
    margin: 0;
    padding: 0 20px;
    vertical-align: middle;
    font-size: 16px;
    font-weight: normal;
    line-height: 50px;
    color: #000000;
    border-radius: 5px;
    -o-transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -ms-transition: all .3s;
    transition: all .3s;
    border: solid 1px #C4C4C4;
}

textarea, textarea.form-control {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 30px;
    height: 260px;
}
.formGroup input[type="text"], .formGroup input[type="email"], .formGroup input[type="password"],.formGroup input[type="tel"],.formGroup input[type="number"], .formGroup textarea {
    width: 100%;
}
*::placeholder{
    color: #dcdcdc;
}
.formGroup input[type="text"].mini,
.formGroup input[type="number"].mini{
    width: 100px;
}
.formGroup {
    margin-bottom: 30px;
}
.contactBox{
    padding-top: 60px;
    padding-bottom: 120px;
}
.contactBox p{
    text-align: center;
    margin-bottom: 30px;
}
.contactBox {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}
.contactBox span{
    color: red;
}

.contactInput2c{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4%;
}
.contactBox label {
    margin-bottom: 10px;
    display: block;
}

.contactBox .blueBtnBox{
    text-align: center;
    margin-bottom: 100px;
}

#contactRlationTitle{
    display: none !important;
}

.form-select-wrap .formInputText{
    padding-left: 20px;
    padding-right: 20px;
}
.form-select-wrap span{
    margin-left: 10px;
    margin-right: 10px;
    color: #22425f;
}

.thanksText{
    font-size: 1.6rem;
    text-align: center;
    margin-bottom: 40px;
    padding: 4%;
    background-color: #f9f9f9;
}

.requiredImg{
    position: absolute;
    width: 43%;
    right: 20px;
    top: 142px;
    border-radius: 20px;
    overflow: hidden;
}


.siteMap{
    padding-top: 60px;
}

.siteMap a {
	color: #333;
	display: block;
	padding: 15px;
}
.siteMapLinkListWrapper{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 4%;
}
.siteMap .siteMapLinkList {
    width: 100%;
    margin-top: 20px;
    font-size: 1.4rem;
}

.siteMap .siteMapLinkList > li > a{
	background-image: url(../images/ico_arrow_gray.svg);
	background-repeat: no-repeat;
	background-position: right 4% center;
    font-weight: bold;
}
.siteMap li {
	width: 100%;
	text-align: left;
	border-left: none;
	padding-left: 0;
	padding-right: 0;
}
.siteMap li:last-child {
	border-right: none;
}
.siteMap .siteMapLinkList > li .child {
	padding-left: 4%;
	padding-right: 4%;
	display: block;
	position: relative;
	padding-top: 0;
	padding-bottom: 0;
	left: auto;
	margin-top: auto;
	width: auto;
	z-index: auto;
	background-color: transparent;
}
.siteMap a.parent.active > span {
	background-color: transparent;
}

.siteMap .siteMapLinkList > li .child li{
	border-bottom: none;
	margin-bottom: 15px;
	padding-bottom: 0;
}

.siteMap .siteMapLinkList > li .child a {
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #f9f9f9;
	border-radius: 5px;
	background-image: url(../images/ico_arrow_circle_blue.svg);
	background-repeat: no-repeat;
	background-position: left 10px center;
	padding-left: 26px;
	font-size: 1.3rem;
	background-size: 10px;
}
.siteMap .siteMapLinkList > li .child .grandChild li a{
    background-image: url(../images/ico_arrow_gray.svg);
    background-color: transparent;
    background-size: 5px;
}
.siteMap .siteMapLinkList > li .child .grandChild{
    padding-top: 10px;
}
.siteMap .siteMapLinkList > li .child .grandChild li{
    margin-bottom: 5px;
}

.siteMapLinkList span.spacer{
    padding-top: 15px;
    padding-bottom: 15px;
    display: block;
    font-weight: bold;
}

.slick-autoplay-toggle-button{
    display: none;
}

.ancrFix{
    padding-top: 100px;
    margin-top: -100px;
}





/*-------------------------------------
 loading
-------------------------------------*/
.loading {
	position: fixed;
	z-index: 999999;
	height: 2em;
	width: 2em;
	overflow: show;
	margin: auto;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display:none;
}

/* Transparent Overlay */
.loading:before {
	content: '';
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
}


/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
	/* hide "loading..." text */
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.loading:not(:required):after {
	content: '';
	display: block;
	font-size: 10px;
	width: 0.5em;
	height: 0.5em;
	margin-top: -0.5em;
	-webkit-animation: spinner 1500ms infinite linear;
	-moz-animation: spinner 1500ms infinite linear;
	-ms-animation: spinner 1500ms infinite linear;
	-o-animation: spinner 1500ms infinite linear;
	animation: spinner 1500ms infinite linear;
	border-radius: 0.5em;
	-webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
	box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
}
.loading.ec:not(:required):after {

	-webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
	box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
  0% {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
.loading em{
	display: block;
    font-size: 12px;
    width: 100%;
    height: 1em;
    position: fixed;
    color: #FFFFFF;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    margin-top: 40px;
}
.loading.ec em{
    color: #000000;
}


.business3dListContents .container{
    width: 100% !important;
}



.slide > .slideContents:not(:first-child) {
    display: none;
}
#video{
    transition: all 1s;
    opacity: 0;
}
.pickupList .slideContents .txt{
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


/* bottom page */
.bottomVisualArea{
    position: relative;
    margin-top: 60px;
    min-height: 200px;
}
.bottomVisualArea h1{
    position: absolute;
    top: 52%;
    left: 4%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    font-size: 2.6rem;
    display: inline-block;
}
.bottomVisualArea h1 span {
    padding-bottom: 10px;
    border-bottom: solid 1px;
    display: block;
    max-width: 450px;
}
.bottomVisualArea h1 em{
    display: block;
    font-size: 1.3rem;
    font-weight: normal;
    margin-top: 10px;

}
.bottomVisualArea .bottomMainVisualImgBox{
    margin-left: auto;
    max-width: 50%;
}
.bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox{
    max-width: none;
}
.bottomGray {
    background-color: #f9f9f9;
    padding-bottom: 120px;
    z-index: 1;
    position: relative;
}
.breadcrumb {
    padding-bottom: 90px;
}
.breadcrumb ul::after{
    clear: both;
    content: '';
    display: block;
}
.breadcrumb ul li{
    float: left;
    padding-left: 20px;
    background-image: url(../images/ico_arrow_gray.svg);
    background-position: left 19px center;
    margin-right: 0;
    background-repeat: no-repeat;
    font-size: 1.3rem;
    background-color: #fff;
    padding:10px 10px 10px 50px;
    background-size: 8px;
}
.breadcrumb ul li.home {
    background-image: url(../images/ico_home.svg);
    background-position: left 19px center;
    background-size: 14px;
    padding-right: 15px;
}
.bottomTopContents{
    position: relative;
}

.bottomTopContents .obiTitle{
    top: -60px;
}



.companyTopBox{
    background-color: #FFF;
    padding: 6%;
    position: relative;
    z-index: 2;
    margin-top: 60px;
    margin-bottom: 5px;
}
.bottomTopContents .hikkiTitle {
    position: absolute;
    top: -90px;
    right: 0;
    width: 340px;
}
.topMassage2c {
    display: grid;
    grid-template-columns: 35% 63%;
    column-gap: 4%;
    margin-bottom: 5px;
}

.companyTopBox h2{
    font-size: 3rem;
    margin-bottom: 30px;
}

.companyTopBox h3 {
    font-size: 2.2rem;
    margin-bottom: 40px;
}
.companyTopBox p {
    line-height: 2;
    margin-bottom: 20px;
}

.Links2c ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 5px;
    row-gap: 5px;
}
.Links2c ul li {
    background-color: #FFF;
    padding: 5%;
}
.rightLink2c{
    display: grid;
    grid-template-columns: 1fr 25%;
    column-gap: 4%;
}
.rightLink2c h2{
    font-size: 1.8rem;
    margin-bottom: 10px;
    position: relative;
}
.rightLink2c h2::after {
    width: 10px;
    height: 10px;
    background-color: #E60012;
    border-radius: 100px;
    position: absolute;
    margin-left: 20px;
    margin-top: 10px;
    content: '';
}
.rightLink2c .viewDetailsBtn {
    display: flex;
    align-items: center;
    justify-content: center;
}
.rightLink2c .viewDetailsBtn a {
    font-size: 1.6rem;
}


.companyDetailBox{
    background-color: #FFF;
    padding: 6%;
    position: relative;
    z-index: 2;
    margin-top: 60px;
    margin-bottom: 5px;
}

.Links3c ul{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 5px;
    row-gap: 5px;
}
.Links3c ul li {
    background-color: #FFF;
    padding: 5%;
}

.companyFooterLinks{
    padding-top: 60px;
}

.companyFooterLinks h2{
    font-size: 3rem;
    margin-bottom: 30px;
    text-align: center;
}

.Links3c .rightLink2c{
    display: grid;
    grid-template-columns: 1fr 40%;
    column-gap: 4%;
}
.Links3c .rightLink2c h2{
    font-size: 1.6rem;
    margin-bottom: 0;
    position: relative;
    text-align: left;
}

.Links3c .rightLink2c .viewDetailsBtn {
    display: flex;
    align-items: center;
    justify-content: center;
}
.Links3c .rightLink2c h2::after{
    display: none;
}
.Links3c .rightLink2c .viewDetailsBtn a {
    font-size: 1.4rem;
    padding-right: 15px;
    background-image: url(../images/ico_arrow_gray.svg);
    background-size: 6px;
    background-repeat: no-repeat;
    background-position: right center;
    letter-spacing: 1px;
}
.Links3c .rightLink2c .viewDetailsBtn a::after{
    display: none;
}
.Links3c .viewDetailsBtn {
    margin-bottom: 0;
}

.topImg {
    float: right;
    width: 60%;
    margin-right: -35%;
    margin-top: -130px;
}
.topMessageText {
    margin-right: 30%;
}

.topMessageDetailBox{
    background-color: #FFF;
    padding: 6%;
    position: relative;
    z-index: 2;
    margin-top: 60px;
    margin-bottom: 5px;
    width: 80%;
}
.topMessageText h2{
    font-size: 2.6rem;
    margin-bottom: 40px;
}
.topMessageText p {
    margin-bottom: 30px;
    line-height: 2.1;
}
.signature {
    text-align: right;
}
.signature .companyName{
    text-align: right;
    margin-bottom: 10px;
    font-size: 1.8rem;
}
.signature .position {
    display: inline-block;
    font-size: 1.8rem;
    margin-right: 20px;
}
.signature .signatureImg {
    display: inline-block;
    width: 200px;
    margin-bottom: 0px;
    vertical-align: sub;
}
.signature .signatureImg img{
    top: 10px;
    position: relative;
}





/* interview */

.visualArea.interviewDetail .slide {
    height: 100vh;
    height: 100dvh;
    position: absolute;
    /*z-index: -1; */
    top: auto;
    left: 50%;
    transform: translate(-50%, 0%);
    width: 177.77777778vh;
    height: 56.25vw;
    min-height: 100vh;
    min-width: 100vw;
    bottom: 0;
}
.visualArea.interviewDetail {
    height: 100vh;
}
.visualArea.interviewDetail .slide img{
    width: 100%;
    height: auto;
}




.interviewDetailStaffInfo {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    background-color: rgba(255,255,255,0.8);
    text-align: left;
    max-width: 50%;
}
.interviewDetailStaffInfo h1 {
    padding: 30px;
    border-bottom: 1px solid #dcdcdc;
    font-size: 28px;
    color: #000;
    font-weight: bold;
    letter-spacing: 1px;
}
.interviewDetailStaffInfo .staffInfo {
    padding: 30px;
    display: grid;
    grid-template-columns: 1fr 60%;
}
.interviewDetailStaffInfo .name{
    display: inline-block;
    font-size: 26px;
    font-weight: bold;
    color: #000;
}
.interviewDetailStaffInfo .info{
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
    column-gap: 1px;
}
.interviewDetailStaffInfo .year{
    display: flex;
    font-size: 14px;
    font-weight: normal;
    background-color: #fff;
    padding: 10px;
    color: #00A3FF;
    align-items: center;
    justify-content: center;

}

.interviewDetailStaffInfo .division{
    display: flex;
    font-size: 14px;
    font-weight: normal;
    background-color: #fff;
    padding: 10px;
    color: #000;
    align-items: center;
    justify-content: center;
}
.interviewIntroBox {
    padding-top: 80px;
    margin-bottom: 30px;
}
.bottomInterviewContents {
    margin-top: 1px;
    padding-top: 90px;
    padding-bottom: 100px;
}
.bottomInterviewContents .obiTitle{
    margin-top: -90px;
    height: 350px;
}
.interviewTopBox{
    background-color: #FFF;
    display: grid;
    grid-template-columns: 1fr 30%;
}
.interviewIntroText {
    padding: 4%;
}
.interviewIntroText .division {
    float: right;
    font-size: 1.6rem;
    padding-top: 20px;
}
.interviewTopBox h2 {
    font-size: 3.6rem;
    margin-bottom: 25px;
}
.interviewIntroText p {
    line-height: 2;
    font-size: 1.8rem;
}

section.interviewSection{
    position: relative;
}
.interviewStaffList {
    z-index: 1;
    position: relative;
}
.interviewStaffList ul{
    z-index: 1;
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4%;
    row-gap: 30px;
}

.interviewStaffList a{
    color: #333;
}
.interviewStaffList a:hover{
    text-decoration: none;
}
.interviewStaffList a h3{
    font-size: 16px;
    margin-bottom: 15px;
    font-weight: bold;
}
.interviewStaffList a .division {
    color: #E60012;
    display: inline-block;
    position: absolute;
    right: 0;
    padding: 3px 10px;
    border: #E60012 1px solid;
    font-size: 12px;
    bottom: 4px;
}
.interviewStaffList ul li{
    position: relative;
}
.interviewStaffList a .name{
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
}
.interviewStaffList .imgBox {
    margin-bottom: 10px;
    border-radius: 10px;
    overflow: hidden;
}


section.interviewSection {
    position: relative;
    padding-bottom: 100px;
}

.interviewQAbox {
    background-color: #FFF;
    padding: 5% 9% 7%;
    margin-bottom: 30px;
}
.wipe_left_to_right.positionR{
    right: 0;
}

.interviewQAbox h3 {
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 10px;
}
.interviewQAbox h3 span.num{
    font-size: 4.5rem;
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
    margin-right: 20px;
}
.interviewQAbox p {
    line-height: 2;
    font-size: 1.6rem;
}

.inteviewImg {
    position: relative;
    width: auto;
    margin: 0 auto;
    max-width: 1200px;
    padding-top: 90px;
}
.inteviewImg::after,
section::after {
	clear: both;
	display: block;
	content: "";
}

.inteviewImg .imgBox {
    max-width: 60%;
}
.positionR .inteviewImg .imgBox{
    margin-left: auto;
}
.positionL .inteviewImg .imgBox{
    margin-right: auto;
}


.interviewObi .wipe_left_to_right {
    height: 370px;
    position: absolute;
}
.interviewObi.positionL .wipe_left_to_right,
.interviewObi.positionL .wipe_right_to_left {
    left: 0;
}
.interviewObi.positionR .wipe_left_to_right,
.interviewObi.positionR .wipe_right_to_left {
    right: 0;
}
.interviewObi .wipe_right_to_left {
    height: 370px;
    position: absolute;
}
section.interviewSection:last-child{
    margin-bottom: 0;
    padding-bottom: 0;
}

.linkToThePeaople h2 {
    text-align: center;
    margin-bottom: 0;
    font-size: 3rem;
}
.linkToThePeaople h2::before, .linkToThePeaople h2::after {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background-color: #E60012;
    position: absolute;
    top: 21px;
}
.linkToThePeaople h2::before{
    margin-left: -30px;
}
.linkToThePeaople h2::after {
    margin-left: 20px;
}
.linkToThePeaople em {
    display: block;
    margin-top: 5px;
    font-weight: normal;
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: 40px;
}
.linkToThePeaople p.lead{
    text-align: center;
    margin-bottom: 60px;
    font-weight: 500;
}
.bottomInterviewContents section.interviewSection:first-child{
    margin-top: 90px;
}


.otherInterview{
    position: absolute;
    right: 0;
    top: -160px;
    width: 350px;
}



.linkToThePeaople {
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: #FFF;
}




/* business */


.businessTopBox{
    background-color: #FFF;
    padding: 6%;
    position: relative;
    z-index: 2;
    margin-top: 60px;
    margin-bottom: 5px;
    padding-bottom: 100px;
}

.businessBttomBox{
    background-color: #FFF;
    padding: 6%;
    position: relative;
    z-index: 2;
    margin-top: 60px;
    margin-bottom: 5px;
}
.businessIntroImgR{
    position: absolute;
    top: 120px;
    right: 0;
    margin-right: calc((100vw - 1200px) / 2 * -1);
    max-width: 46vw;
}


.businessHikkiTitle{
    position: absolute;
    right: 0;
    top: -90px;
    width: 370px;
}

.businessBottomSection {
    margin-bottom: 200px;
    position: relative;
}
.businessBottomSection .businessBottomContentsBox h3{
    font-size: 2.2rem;
    margin-bottom: 30px;
    text-align: left;
}
.businessBottomContentsBox p{
    line-height: 2;
    margin-bottom: 20px;
    text-align: justify;
}
.businessBottomSection p{
    text-align: justify;
}
.businessBottomContentsBox p:last-child{
    margin-bottom: 0
}
.businessBottomContentsBox h5{
    font-weight: bold;
    font-size: 1.8rem;
    position: relative;
    padding-left: 20px;
    margin-bottom: 10px;
}
.businessBottomContentsBox h5::before{
    content: '';
    width: 8px;
    height: 8px;
    background-color: #E60012;
    position: absolute;
    left: 0;
    top: 12px;
    border-radius: 100px;
}
.businessBottomContentsBox.imgRexsist{
    margin-right: 50%;
}
.businessBottomSection h4 {
    font-size: 1.8rem;
    text-align: center;
    padding-bottom: 20px;
    position: relative;
    margin-bottom: 20px;
}
.businessBottomSection h4::after{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #E60012;
    width: 6px;
    height: 6px;
    content: '';
    border-radius: 100px;
}
.businessPoint3c ul{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 4%;
    row-gap: 30px;
    position: relative;
    z-index: 1;
}
.businessPoint3c ul li {
    background-color: #FFF;
    padding: 8%;
}

.pdgTopMore{
    padding-top: 60px;
}

.businessBottomSection h3{
    font-size: 2rem;
    text-align: center;
    margin-bottom: 50px;
} 
.businessBottomSection h3 span{
    font-size: 14px;
    display: block;
    font-weight: normal;
    margin-top: 15px;
}

.businessObiBottom .wipe_left_to_right {
    right: 0;
    bottom: -80px;
    height: 230px;
    width: 30%;
    position: absolute;
}

.businessObi .wipe_left_to_right {
    height: 370px;
    position: absolute;
}
.businessObiBottom.positionL .wipe_left_to_right,
.businessObi.positionL .wipe_left_to_right,
.businessObi.positionL .wipe_right_to_left {
    left: 0;
}
.businessObiBottom.positionR .wipe_left_to_right,
.businessObi.positionR .wipe_left_to_right,
.businessObi.positionR .wipe_right_to_left {
    right: 0;
}
.businessObi .wipe_right_to_left {
    height: 370px;
    position: absolute;
}

.bottomMainMovieBox{
    aspect-ratio: 16 / 9;
    width: 100%;
}
.bottomMainMovieBox video{
    aspect-ratio: 16 / 9;
    width: 100%;
}
.obiTitle h3 {
    font-family: 'Filson Pro',"Helvetica Neue", "Helvetica";
    font-size: 3.4rem;
    margin-top: 15px;
    margin-left: 8%;
    position: absolute;
}

.bottomTopContents .businessBottomSection .obiTitle {
    top: -80px;
}
.businessPoint2c {
    padding-top: 180px;
    z-index: 2;
    position: relative;
}
.businessPoint2c h5{
    text-align: center;
    margin-top: 10px;
    font-size: 2rem;
}
.businessPoint2c ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4%;
    row-gap: 30px;
    position: relative;
    z-index: 1;
}
.businessPoint2c ul li {
    background-color: #FFF;
    padding: 8%;
}



.otherBusiness{
    position: absolute;
    right: 0;
    top: -160px;
    width: 350px;
}



.otherBusinssUnit {
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: #FFF;
}



.otherBusinssUnit h2{
    text-align: center;
    margin-bottom: 40px;
    font-size: 3rem;
}
.otherBusinssUnit h2::before, .otherBusinssUnit h2::after {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background-color: #E60012;
    position: absolute;
    top: 21px;
}
.otherBusinssUnit h2::before{
    margin-left: -30px;
}
.otherBusinssUnit h2::after {
    margin-left: 20px;
}
.otherBusinssUnit em{
    display: block;
    margin-top: 15px;
    font-weight: normal;
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
}
.otherBusinssUnit p.lead{
    text-align: center;
    margin-bottom: 60px;
    font-weight: 500;
}
.otherBusinssUnit .topBussinessUnit ul{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
.otherBusinssUnit .topBussinessUnit {
    margin-bottom: 60px;
}



.backToTop {
    margin-bottom: 20px;
    text-align: center;
}
.backToTop a{
    font-size: 2rem;
    font-weight: bold;
    display: inline-block;
    position: relative;
    font-family: "din-2014", sans-serif;
    letter-spacing: 1px;
}
.backToTop a:hover{
    text-decoration: none;
}
.backToTop a::after{
    width: 100%;
    height: 3px;
    background-color: #000;
    position: absolute;
    bottom: -5px;
    content: '';
    left: 0;
}


/* business top */
.businessTopMainImg{
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 4%;
    padding-right: 4%;
}
.bottomVisualArea.businessTop h2{
    color: #E60012;
    text-align: center;
    margin-bottom: 60px;
    font-size: 3.2rem;
}
.bottomVisualArea.businessTop h1{
    top: 43px;
}
.bottomVisualArea.businessTop.footwear h1{
    padding:15px;
    background-color: #FFF;
}

.businessTopHead h2 {
    text-align: center;
    margin-bottom: 0;
    font-size: 3rem;
}
.businessTopHead em {
    display: block;
    margin-top: 15px;
    font-weight: normal;
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: 30px;
}
.businessTopHead h2::before,
.businessTopHead h2::after {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 100px;
    background-color: #E60012;
    position: absolute;
    top: 21px;
}
.businessTopHead h2::before{
    margin-left: -30px;
}
.businessTopHead h2::after {
    margin-left: 20px;
}
.businessTopContents {
    padding-bottom: 20px;
    padding-top: 120px;
}
.businessTopHead p.lead {
    text-align: center;
    margin-bottom: 60px;
    font-weight: 500;
}
section.businessTopSection{
    margin-bottom: 120px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4%;
}

.businessTopTextBox{
    background-color: #fff;
    padding: 6%;
}

.businessTopTextBox h3{
    font-size: 2.8rem;
    margin-bottom: 30px;
}

.businessTopTextBox h4{
    font-size: 2rem;
    margin-bottom: 30px;
}

.businessTopTextBox p{
    margin-bottom: 30px;
    line-height: 2;
}
.businessSectionL .imgBox{
    margin-left: calc((100vw - 1200px) / 2 );
    z-index: 2;
    position: relative;
}

.businessSectionR .textBox{
    margin-right: calc((100vw - 1200px) / 2 );
}

.businessSectionR .imgBox{
    margin-right: calc((100vw - 1200px) / 2 );
    z-index: 2;
    position: relative;
}

.businessSectionL .textBox{
    margin-left: calc((100vw - 1200px) / 2 );
}



.businessSectionR .businessTopTextBox{
    padding-right: 0;
}
.businessSectionL .businessTopTextBox{
    padding-left: 0;
}

.businessSectionR .obiTitle{
    right: 0;
}

.otherDepartmentsBox{
    padding-top: 100px;
    padding-bottom: 100px;
}

.otherDepartmentsBox .imgBox{
    margin-bottom: 40px;
}

.departmentsList ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 10px;
    row-gap: 10px;
}
.departmentsList ul li{
    padding: 4%;
    background-color: #FFF;
}
.departmentsList ul li h3{
    margin-bottom: 10px;
    font-size: 1.8rem;
}

.departmentsList ul li.spacer{
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.departmentsList ul li.spacer img{
    max-width: 100%;
}
.businessPoint2c.noPadding{
    padding-top: 0;
}
.businessPoint2c .logoImgBox{
    margin-bottom: 30px;
    text-align: center;
    max-height: 50px;
}
.businessPoint2c .logoImgBox img {
    max-width: 80%;
    height: auto;
    max-height: 36px;
}

.businessBttomBox .businessPoint2c{
    padding-top: 0;
}
.brandsLogo6c {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    margin-bottom: 15px;
    margin-top: 20px;
}

.brandsLogo6c img{
    vertical-align: -webkit-baseline-middle;
}




/* group identity */


.groupIdentityBox{
    background-color: #f9f9f9;
    padding: 6%;
    margin-top: 60px;
    z-index: 1;
}
section.groupIdentitySection{
    margin-bottom: 30px;
}

.groupIdentityBox h3{
    text-align: center;
    font-size: 3rem;
    margin-bottom: 20px;
}

.groupIdentityBox p.lead{
    font-size: 2rem;
    margin-bottom: 40px;
    font-weight: bold;

}
.groupIdentityBox h4 {
    font-size: 2.2rem;
    text-align: center;
    padding-bottom: 20px;
    position: relative;
    margin-bottom: 20px;
}
.groupIdentityBox h4::after{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #E60012;
    width: 10px;
    height: 10px;
    content: '';
    border-radius: 100px;
}

section.groupIdentitySection{
    padding: 6%;
    background-color: #FFF;
    margin-bottom: 20px;
}
section.groupIdentitySection p{
    font-size: 1.5rem;
    margin-bottom: 20px;
}
section.groupIdentitySection p strong {
    font-size: 2rem;
    line-height: 1.4;
}
section.groupIdentitySection p.redCopy{
    font-weight: bold;
    font-size: 4rem;
    text-align: center;
    color: #E60012;
}
.groupIdentitySection .imgBox{
    text-align: center;
}
.groupLinkBox ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 10px;
    column-gap: 10px;
}
.groupLinkBox ul li{
    background-color: #FFF;
}

.groupLinkBox ul li a{
    display: block;
    padding: 6%;
}
.groupLinkBox ul li .name {
    font-size: 1.8rem;
    display: flex;
    align-items: center;
    font-weight: bold;
}
.groupLinkBox ul li .name span{
    display: block;
    margin-top: 5px;
    font-size: 1.4rem;
    font-weight: normal;
}
.groupLinkBox ul li a {
    display: grid;
    grid-template-columns: 1fr 80px;
    height: 100%;
}
.groupLinkBox ul li a.blank{
    background-image: url(../images/icon_blank.svg);
    background-repeat: no-repeat;
    background-position: right 10px top 10px;
}
.groupLinkBox ul li a .viewDetails div{
    font-size: 1.4rem;
    font-weight: bold;
    display: inline-block;
    position: relative;
    font-family: "din-2014", sans-serif;
    letter-spacing: 0;
}
.groupLinkBox ul li a .viewDetails div:hover{
    text-decoration: none;
}
.groupLinkBox ul li a .viewDetails div::after{
    width: 100%;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: 0px;
    content: '';
    left: 0;
}
.groupLinkBox ul li a .viewDetails {
    display: flex;
    align-items: center;
    height: 100%;
}
.groupIdentityFL{
    background-color: #FFF;
    padding-bottom: 120px;
    padding-top: 120px;
}

.signature .signatureImg.en {
    display: inline-block;
    width: auto;
    margin-bottom: 0px;
    vertical-align: inherit;
    font-size: 3rem;
}


.businessIntroImgR {
    max-height: 430px;
    overflow: hidden;
}

/* recruit */
.recruitBtn2c ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 6%;
    row-gap: 20px;
}
.recruitBtn2c ul li{
    padding-left: 0;
}
.recruitBtn2c ul li::before{
    display: none;
}
.recruitBtn2c ul li a{
    display: block;
    border: #E60012 solid 3px;
    text-align: center;
    padding: 20px;
    font-size: 1.6rem;
    color: #E60012;
    background-image: url(../images/ico_arrow_red.svg);
    background-size: 10px;
    background-position: right 20px center;
    background-repeat: no-repeat;
}
.articleBody .recruitBtn2c ul{
    padding-left: 0;
}


.movieBox01 {
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-bottom: 20px;
}
.movieBox01 iframe {
  width: 100%;
  height: 100%;
}

.businessIntroImgR.h3exist{
    top: 200px;
}

.boxH3{
    
}
.groupCompaniesList .logoBox {
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8%;
}
.groupCompaniesList .logoBox img{
    max-width: 100%;
}


.articleBody .contactBox .leadTxt p {
    font-weight: normal;
    font-size: 1.8rem;
    text-align: center;
    background-color: #f9f9f9;
    padding: 4%;
}

.btnBlack {
    text-align: center;
}
.btnBlack a{
    display: inline-block;
    padding: 15px 100px;
    font-weight: bold;
    font-size: 1.8rem;
    text-align: center;
    color: #FFF;
    background-color: #000;
    text-decoration: none;
}




.companyDetailBox .pickupList{
    margin-bottom: 40px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 4%;
    row-gap: 50px;
}
.companyDetailBox .pickupList .slick-slide {
    margin-left: 3px;
    margin-right: 3px;
}
.companyDetailBox .pickupList div.slideContents {
    background-color: #FFFFFF;
    padding: 25px 25px 55px 25px;
    box-sizing: border-box;
    border-radius: 0px;
    box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.05);
}
.companyDetailBox .pickupList div.slideContents .imgBox {
    margin-bottom: 15px;
    border-radius: 0;
    overflow: hidden;
    margin-left: -25px;
    margin-right: -25px;
    margin-top: -25px;
}
.companyDetailBox .pickupList div.slideContents .imgBox img {
    width: 100%;
    object-fit: cover;
    max-height: 200px;
}


.newsYearListBox{
    background-color: #FFF;
    margin-bottom: 20px;
    z-index: 1;
    position: relative;
}
.newsYearListBox ul{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 20px;
    row-gap: 15px;
}

.newsYearListBox ul li a{
    display: block;
    background-color: #f9f9f9;
    font-size: 18px;
    font-weight: normal;
    text-align: center;
    padding: 10px;
}

.newsYearListBox ul li a.current {
    background-color: #f9f9f9;
    font-weight: bold;
    border-top: #E60012 solid 3px;
    box-sizing: content-box;
}


h2.yearSelect {
    font-size: 3.2rem;
    padding-left: 40px;
    position: relative;
    margin-bottom: 20px;
}

.companyDetailBox .pickupList div.slideContents{
    position: relative;
}
.companyDetailBox .pickupList div.slideContents .dateText{
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 7px 25px;
    background-color: #f9f9f9;
    color: #777;
}

h2.yearSelect::before{
    content: '';
    width: 15px;
    height: 15px;
    background-color: #E60012;
    border-radius: 100px;
    top: 21px;
    left: 0;
    position: absolute;
}



.pagination-1 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 8px;
    list-style-type: none;
    padding: 0;
}

.pagination-1 a {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2em;
    height: 2em;
    border: 1px solid #1a1a1a;
    border-radius: 1px;
    color: #1a1a1a;
}

.pagination-1 a:not(:hover) {
    text-decoration: none;
}

.pagination-1 .current a {
    background-color: #1a1a1a;
    color: #fff;
    pointer-events: none;
}



/* footwear brand detail */
.bottomVisualArea.footwearBrandHero {
    margin-bottom: 0;
    position: relative;
    color: #fff;
}

.bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox {
    background: #000;
}

.bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .7;
}

.footwearBrandHeroInner {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    height: 100%;
    top: 0;
    margin: auto;
}

.footwearBrandHeroInner .brandLogo {
    max-width: 320px;
    margin-bottom: 25px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.footwearBrandHeroInner .brandHeroContentsBox{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    min-width: 70%;
}
.footwearBrandHeroInner .brandLogo img {
    width: 100%;
}
.footwearBrandHeroInner h1 {
    font-size: 4.8rem;
    line-height: 1.1;
    margin-bottom: 10px;
    color: #fff;
    position: relative;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    display: block;
}

.footwearBrandHeroInner h2 {
    font-size: 2.4rem;
    margin-bottom: 15px;
    color: #fff;
    text-align: center;
}

.footwearBrandHeroInner p {
    max-width: 820px;
    font-size: 1.8rem;
    line-height: 1.8;
    text-align: center;
}

.footwearBrandDetail {
    padding-top: 70px;
}

.footwearBrandIntro {
    margin-bottom: 80px;
}
.footwearBrandIntro .inner{
    background-color: #FFF;
    padding: 4%;
}

.footwearBrandIntroHead {
    margin-bottom: 30px;
}

.footwearBrandIntroHead h2 {
    font-size: 4.2rem;
    line-height: 1.2;
    margin-bottom: 20px;
}

.footwearBrandIntroHead .lead {
    font-size: 2.2rem;
    line-height: 1.8;
    font-weight: bold;
    text-align: center;
}

.footwearBrandIntroBody {
    display: grid;
    grid-template-columns: 25% 1fr 25%;
    column-gap: 3%;
}



.footwearBrandIntroImages {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.footwearBrandIntroImages img {
    width: 100%;
    display: block;
}

.footwearBrandIntroText h3 {
    font-size: 3rem;
    line-height: 1.4;
    margin-bottom: 20px;
}

.footwearBrandIntroText p {
    font-size: 1.6rem;
    line-height: 2;
}

.footwearBrandFeatures {
    margin-bottom: 100px;
}

.footwearBrandFeatures ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px 30px;
}

.footwearBrandFeatures li .imgBox {
    margin-bottom: 20px;
}

.footwearBrandFeatures li .imgBox img {
    width: 100%;
    display: block;
}

.footwearBrandFeatures li h4 {
    font-size: 2.2rem;
    line-height: 1.5;
    margin-bottom: 10px;
}

.footwearBrandFeatures li p {
    font-size: 1.5rem;
    line-height: 1.9;
}

.footwearBrandShops {
    padding-bottom: 90px;
}

.footwearBrandShops .obiTitle {
    margin-bottom: 40px;
}

.footwearBrandShops ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4%;
    padding-top: 20px;
}

.footwearBrandShops li {
    display: block;

    padding: 0;
    background-color: #000;
}
.footwearBrandShops li a{
    display: grid;
    grid-template-columns: 1fr 1fr;
    color: #FFF;
}
.footwearBrandShops li a h4{
    color: #E60012;
    margin-bottom: 8px;
    font-size: 2rem;
}
.footwearBrandShops li .imgBox {
    margin-bottom: 0;
}
.footwearBrandShops li .shopTextContents{
    display: flex;
    align-items: center;
    padding-left: 8%;
}

.footwearBrandShops li .imgBox img {
    width: 100%;
    max-height: none;
    object-fit: contain;
    margin-bottom: 0;
}

.footwearBrandShops li p {
    font-size: 1.5rem;
    line-height: 1.7;
}

@media screen and (max-width: 1024px) {
    .bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox {

    }

    .footwearBrandHeroInner {
        bottom: 60px;
    }

    .footwearBrandHeroInner h1 {
        font-size: 3.8rem;
    }

    .footwearBrandHeroInner h2 {
        font-size: 2rem;
    }

    .footwearBrandHeroInner p {
        font-size: 1.5rem;
    }

    .footwearBrandIntroHead h2 {
        font-size: 3.2rem;
    }

    .footwearBrandIntroHead .lead {
        font-size: 1.7rem;
    }

    .footwearBrandIntroBody {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .footwearBrandShops ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 767px) {
    .bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox {

    }

    .footwearBrandHeroInner {
        bottom: 35px;
    }

    .footwearBrandHeroInner .brandLogo {
        max-width: 170px;
        margin-bottom: 16px;
    }

    .footwearBrandHeroInner h1 {
        font-size: 2.8rem;
    }

    .footwearBrandHeroInner h2 {
        font-size: 1.7rem;
        margin-bottom: 10px;
    }

    .footwearBrandHeroInner p {
        font-size: 1.4rem;
        line-height: 1.7;
    }

    .footwearBrandDetail {
        padding-top: 45px;
    }

    .footwearBrandIntro {
        margin-bottom: 45px;
    }

    .footwearBrandIntroHead {
        margin-bottom: 20px;
    }

    .footwearBrandIntroHead h2 {
        font-size: 2.5rem;
        margin-bottom: 12px;
    }

    .footwearBrandIntroHead .lead {
        font-size: 1.5rem;
    }

    .footwearBrandIntroImages {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .footwearBrandIntroText h3 {
        font-size: 2.2rem;
        margin-bottom: 12px;
    }

    .footwearBrandIntroText p {
        font-size: 1.4rem;
        line-height: 1.8;
    }

    .footwearBrandFeatures {
        margin-bottom: 45px;
    }
        .footwearBrandFeatures {
        margin-bottom: 125px;
    }

    .footwearBrandFeatures ul {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .footwearBrandFeatures li h4 {
        font-size: 1.9rem;
    }

    .footwearBrandFeatures li p {
        font-size: 1.4rem;
    }

    .footwearBrandShops {
        padding-bottom: 55px;
    }

    .footwearBrandShops .obiTitle {
        margin-bottom: 25px;
    }

    .footwearBrandShops ul {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .footwearBrandShops li {
        padding: 22px 18px;
    }
}

/* business linked sections */
.businessLinkedSection {
    margin-top: 80px;
    padding-bottom: 60px;
}

.businessLinkedSection .obiTitle h3 span {
    display: inline-block;
    margin-left: 16px;
    font-size: 1.6rem;
    font-weight: 500;
}

.businessLinkedList ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
}

.businessLinkedList ul li {
    background-color: #fff;
}

.businessLinkedList ul li .imgBox img {
    width: 100%;
    display: block;
}

.businessLinkedList ul li .textBox {
    padding: 24px 24px 26px;
}

.businessLinkedList ul li .textBox h3{
    font-size: 2rem;
    line-height: 1.4;
    margin-bottom: 8px;
    min-height: 5rem;
}
.businessLinkedStoreList ul li .textBox h4,
.businessLinkedShopList ul li .textBox h4 {
    font-size: 2rem;
    color: #E60012;
    margin-bottom: 7px;
}
.businessLinkedList ul li .textBox em {
    display: block;
    font-style: normal;
    color: #777;
    font-size: 1.3rem;
    line-height: 1.6;
    margin-bottom: 12px;
}

.businessLinkedList ul li .textBox p {
    font-size: 1.5rem;
    line-height: 1.9;
}
.businessLinkedList.businessLinkedBusinessList,
.businessLinkedList.businessLinkedStoreList,
.businessLinkedList.businessLinkedShopList{
    padding-top: 40px;
}

.businessLinkedList ul li .textBox p.copy {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 8px;
}

.businessLinkedList ul li .textBox p.detail {
    color: #333;
}

.businessLinkedStoreList ul,
.businessLinkedShopList ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
}

.businessLinkedStoreList ul li,
.businessLinkedShopList ul li {
    background-color: #000;
}
.businessLinkedStoreList ul li a, .businessLinkedShopList ul li a {
    color: #fff;
    height: 100%;
    display: grid;
    grid-template-columns: 40% 1fr;
}
.businessLinkedStoreList ul li .textBox, .businessLinkedShopList ul li .textBox {
    padding: 4px 17px 0px;
    line-height: 1;
    display: flex;
    align-items: center;
}


.businessLinkedStoreList ul li .textBox p,
.businessLinkedShopList ul li .textBox p {
    color: #fff;
    margin-bottom: 0;
}

.businessLinkedStoreList ul li .textBox p.titleEn, .businessLinkedShopList ul li .textBox p.titleEn {
    font-size: 1.1rem;
    margin-bottom: 0;
}

.businessLinkedStoreList ul li .textBox p.titleJp, .businessLinkedShopList ul li .textBox p.titleJp {
    font-size: 1.1rem;
    color: #ddd;
}

@media screen and (max-width: 1024px) {
    .businessLinkedSection {
        margin-top: 60px;
    }

    .businessLinkedList ul {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .businessLinkedStoreList ul,
    .businessLinkedShopList ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .footwear .businessTopMainImg {
        padding-top: 20px;
        padding-bottom: 0px;
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 767px) {
    .businessLinkedSection {
        margin-top: 42px;
    }
    .businessLinkedList.businessLinkedBusinessList, .businessLinkedList.businessLinkedStoreList, .businessLinkedList.businessLinkedShopList {
        padding-top: 20px;
    }

    .businessBottomSectionFootWear .businessPoint2c ul li {
        background-color: #FFF;
        padding: 0;
    }
    .businessLinkedList ul li .textBox h3{
        min-height: auto !important;
        margin-top: 5px;
    }
    .businessLinkedShopList .obiTitle h3{
        font-size: 2.4rem;
        line-height: 1.2;
    }
    .bottomVisualArea.footwearBrandHero .bottomMainVisualImgBox img {
        width: auto;
        height: 50vh;
        object-fit: cover;
        opacity: .7;
    }


    .businessLinkedSection .obiTitle h3{
        font-size: 2.4rem;
        line-height: 1.2;
    }
    .businessLinkedSection .obiTitle h3 span {
        display: block;
        margin-left: 0;
        margin-top: 4px;
        font-size: 1.3rem;
    }

    .businessLinkedList ul li .textBox {
        padding: 5px 14px 7px;
    }
    .businessLinkedList ul li .textBox h3, .businessLinkedList ul li .textBox h4 {
        font-size: 1.8rem;
    }
    .businessLinkedStoreList ul li .textBox h4, .businessLinkedShopList ul li .textBox h4 {
        font-size: 2rem;
        color: #E60012;
        margin-bottom: 5px;
    }

    .businessLinkedList ul li .textBox p.copy {
        font-size: 1.6rem;
    }
    .businessLinkedStoreList ul li .textBox h4, .businessLinkedShopList ul li .textBox h4 {
        font-size: 1.6rem;
    }

    .businessLinkedList ul li .textBox p {
        font-size: 1.4rem;
    }

    .businessLinkedStoreList ul,
    .businessLinkedShopList ul {
        grid-template-columns: 1fr;
    }
    .businessLinkedStoreList ul li .textBox p.titleEn, .businessLinkedShopList ul li .textBox p.titleEn{
        line-height: 1;
    }
}