/*------------------------------------------------------------
FOR PC LAYOUT CSS
------------------------------------------------------------*/

@media screen and (min-width:768px){

/*------------------------------------------------------------
BODY BASIC
------------------------------------------------------------*/
body{
color:#4d4d4d;
font-size:14.4px;
line-height:1.75;
width:100%;
overflow:hidden;
font-feature-settings:'palt';
}

#container{
}


/*------------------------------------------------------------
RESPONSIVE
------------------------------------------------------------*/
.pconly{ display:block; }
.sponly{ display:none; }



/*------------------------------------------------------------
header
------------------------------------------------------------*/
.pc-head,
.kv-head,
.p-head{
display:none;
}

/*------------------------------------------------------------
KV
------------------------------------------------------------*/


#kv{
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: -1; /* 背景に配置 */
}

.video-container {
  position: absolute; /* kv内で相対的に配置 */
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw;        /* 16:9比率 */
  min-height: 100vh;
  min-width: 177.78vh;    /* 縦長画面カバー用 */
  transform: translate(-50%, -50%);
  z-index: 0;
}

.video-container video {
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/*------------------------------------------------------------
TOP PAGE CONTENT
------------------------------------------------------------*/

#index1{
position:relative;
padding:263px 0 281px;
height:1142px;
}

.i1-inner{
width:1120px;
margin:0 auto;
}
.i1-cont{
width:656px;
margin:228px 0 0 464px;

}
.i1-cont h2{
font-size:41px;
line-height:1.5;
margin-bottom:1em;
font-weight:400;
}
.i1-cont p{
font-size:18px;
}

.bg-type{
width:100%;
white-space:nowrap;
overflow:hidden;
font-size:202px;
line-height:224px;
color:#f1f1f1;
position:absolute;
top:280px;
left:0;
z-index:-1;
}


#index2{
width:1100px;
margin:0 auto;
padding:0 0 251px;
}

#index2 h2{
font-size:80px;

line-height:96px;
margin-bottom:64px;
}
#index2 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:14px;
line-height:1.2;
}

.top-prd{
display:flex;
justify-content:space-between;
}
.top-prd li{
width:261px;
}
.p-wrap{
background:#f1f1f1;
padding:16px;
margin-bottom:16px;
transition:all .2s;
}

.top-prd li:hover .p-wrap{
background:#ebf1f7;
}

.p-type{
color:#0b75e1;
font-size:27px;
}
.p-thumb{
display:flex;
justify-content:center;
align-items:center;
text-align:center;
width:208px;
margin:27px auto 38px;
height:194px;
}

.p-det{
display:flex;
justify-content:space-between;
}
.p-size{
width:56px;
display:flex;
}
.p-size li{
width:26px;
height:26px;
}
.size-m{
width:26px;
height:26px;
background:#0B75E1;
border-radius:50%;
color:#fff;
font-size:11px;
line-height:26px;
margin-right:5px;
text-align:center;
}
.size-l{
width:26px;
height:26px;
background:#989898;
border-radius:50%;
color:#fff;
font-size:11px;
line-height:26px;
text-align:center;
}

.p-link{
width:26px;
height:26px;
border:2px solid #989898;
position:relative;
border-radius:50%;
display:block;
}
.p-link::after{
content:'';
width:6px;
height:6px;
border-right:2px solid #989898;
border-bottom:2px solid #989898;
transform:rotate(-45deg);
position:absolute;
top:7px;
right:8px;
}
.p-desc{
font-size:14px;
font-weight:500;
margin:0;
}


#index3{
padding:0 0 238px;
}

#index3 h2{
width:1120px;
margin:0 auto;
font-size:80px;

line-height:96px;
margin-bottom:64px;
}
#index3 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:14px;
line-height:1.2;
margin-top:1em;
}

.banner-wrapper {
overflow: hidden;
position: relative;
height: 496px;
padding:0;
}

.banner-wrapper a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:10;
}

.banner-track {
display: flex;
animation: scrollLeft 30s linear infinite;
width: max-content;
}
.banner-item {
flex: 0 0 auto;
width: 248px;
height: 496px;
background:linear-gradient(-45deg, rgba(34,82,136,.64) 0%, rgba(67,94,148,.5) 33%, rgba(85,150,157,.2) 66%, rgba(85,150,157,.05) 100%);
}
.banner-item img {
width: 100%;
height: 100%;
object-fit: cover;
}

@keyframes scrollLeft {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}


#index4{
width:1100px;
margin:0 auto;
padding:0 0 214px;
}

#index4 h2{
font-size:80px;

line-height:96px;
margin-bottom:64px;
}
#index4 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:14px;
line-height:1.2;
}
.top-about-img img{
transition:all .2s;
}
.top-about-img a:hover img{
opacity:.8;
}

#index5{
width:1120px;
margin:0 auto;
padding:0 0 188px;
}

#index5 h2{
width:auto;
font-size:80px;

line-height:96px;
margin-bottom:80px;
}

.feed{
border-top:1px solid #b2b2b2;
}

.feed li{
padding:16px;
border-bottom:1px solid #b2b2b2;
position:relative;
}

.feed-info{
font-size:18px;
line-height:25px;
display:flex;
gap:0 24px;
align-items:center;
margin-bottom:16px;
}

.feed-date{
width:100px;
}
.feed-cat{
width:180px;
color:#0B75E1;
display:inline-block;
padding:5px 30px;
border:1px solid #0B75E1;
border-radius:23px;
text-align:center;
}

.feed-ttl{
font-size:18px;
line-height:25px;
}

.feed-link{
display:flex;
justify-content:flex-end;
margin-bottom:12px;
}
.feed-link a{
padding-left:32px;
position:relative;
font-size:14px;
line-height:24px;
color:#4d4d4d;
}
.feed-link a::before{
content:'';
width:24px;
height:24px;
background:url(img/arrow-circle-gray.svg) no-repeat;
background-size:24px;
position:absolute;
top:0;
left:0;
}
.feed-link a:hover{
color:#0B75E1;
}
.feed li:hover .feed-ttl{
color:#0B75E1;
}

.feed li a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}


/*------------------------------------------------------------
PAGE ABOUT
------------------------------------------------------------*/
#page-about{
width:100%;
padding:160px 0 150px;
}

.head-about{
width:1100px;
position:relative;
margin:0 auto 160px;
}
.head-about-img{
width:1100px;
height:579px;
background:url(img/about01-md.jpg) no-repeat center center;
background-size:cover;
margin-bottom:50px;
}

.head-about-ttl{
width:1100px;
padding:0;
margin:0 auto;
}
.head-about-ttl h2{
width:auto;
font-size:125px;
line-height:152px;
text-align:center;
margin-bottom:72px;
}
.head-about-ttl h2 span{
display:block;
font-size:26px;
line-height:1.2;
font-family:'Noto Sans JP';
}
.head-about-ttl p{
width:561px;
font-size:16px;
line-height:28px;
padding:0;
margin:0 auto;
}


.about-cont01{
width:100%;
position:relative;
margin:0 0 192px;
display:flex;
}
.about-cont01-img{
width:50%;
height:460px;
background:url(img/about02.jpg) no-repeat center;
background-size:cover;
}
.about-cont01-txt{
display:flex;
width:50%;
justify-content:center;
padding:0;
}
.about-cont01-txt-inner{
margin-bottom:0;
}

.about-cont01-txt h3{
font-size:80px;
line-height:94px;
text-align:center;
margin:0 0 42px;
}
.about-cont01-txt h3 span{
display:block;
font-size:29px;
line-height:1.3 !important;
font-weight:normal;
}

.about-md-sub{
font-size:1.98vw;
line-height:1;
text-align:center;
margin:0 0 72px;
white-space:nowrap;
font-weight:500;
}
.about-md-sub span{
color:#0B75E1;
}
.about-cont01-txt p{
width:67%;
margin:0 auto;
font-size:16px;
line-height:28px;
}

.about-cont02{
width:100%;
margin:0 auto 168px;
}
.about-cont02 h2{
font-size:80px;
line-height:1;
margin-bottom:28px;

text-align:center;
}

.about-cont02-img{
width:100%;
height:0;
padding-bottom:24.8%;
background:url(img/about03.jpg) no-repeat center center;
background-size:cover;
margin-bottom:18px;
}

.office-list{
max-width:1120px;
margin:0 auto;
display:flex;
justify-content:space-between;
}
.office-list li{
width:540px;
font-size:13px;
line-height:22px;
margin:0;
}
.office-txt{
border-left:2px solid #b3b3b3;
padding:32px 40px 0;
min-height:300px;
margin-bottom:40px;
}

.office-list li h3{
font-size:29px;
line-height:1;
margin-bottom:40px;
}
.office-list li p{
margin-bottom:1.5em;
}

.page-link a{
color:#4d4d4d;
position:relative;
display:inline-block;
padding-right:21px;
line-height:1.75;
}
.page-link a::after{
content:'';
width:16px;
height:16px;
background:url(img/arrow-circle-gray.svg) no-repeat;
background-size:16px;
position:absolute;
right:0;
top:4px;
}

.page-link a:hover{
color:#0B75E1;
}
.page-link a:hover::after{
right:-2px;
}

.office-thumb{
width:540px;
height:320px;
background:#f0f0f0;
}

.about-cont03{
width:100%;
}

.about-cont03 h2{
width:1120px;
margin:0 auto;
font-size:80px;

line-height:1.2;
}
.about-cont03 h2 span{
display:block;
font-size:26px;
}

.his-md-wrap{
width:1100px;
height:636px;
margin:0 auto;
overflow-x:scroll;
overflow-y:hidden;
}


.md-scroll{
display:block;
width:1100px;
position:relative;
font-size:14px;
line-height:20px;
margin:20px auto 20px;
text-align:right;
padding:0 40px 30px 0;

}
.md-scroll::after{
content:'';
width:100px;
height:30px;
position:absolute;
top:10px;
right:0;
background:url(img/arrow-border-right.svg) no-repeat;
background-size:100px;
}


.history-wrap{
width:1620px;
height:618px;
position:relative;
background:none;
}
.history-wrap::after{
content:'';
width:100%;
height:50px;
background:#98B4C9;
position:absolute;
bottom:0;
left:0;
z-index:-1;
}




.his-list{
width:1501px;
margin:0 auto;
position:relative;
}
.his-list li:nth-child(1){
width:177px;
height:675px;
position:absolute;
top:0;
left:0;
}

.his-list li:nth-child(2){
width:147px;
height:343px;
position:absolute;
top:262px;
left:115px;
}
.his-list li:nth-child(3){
width:177px;
height:675px;
position:absolute;
top:0;
left:200px;
}
.his-list li:nth-child(4){
width:147px;
height:343px;
position:absolute;
top:262px;
left:318px;
}
.his-list li:nth-child(5){
width:147px;
height:342px;
position:absolute;
top:262px;
left:483px;
}
.his-list li:nth-child(6){
width:147px;
height:343px;
position:absolute;
top:262px;
left:647px;
}
.his-list li:nth-child(7){
width:147px;
height:343px;
position:absolute;
top:262px;
left:812px;
}
.his-list li:nth-child(8){
width:177px;
height:605px;
position:absolute;
top:0;
left:900px;
}
.his-list li:nth-child(9){
width:177px;
height:605px;
position:absolute;
top:0;
left:1086px;
}
.his-list li:nth-child(10){
width:147px;
height:343px;
position:absolute;
top:262px;
left:1189px;
}
.his-list li:nth-child(11){
width:147px;
height:343px;
position:absolute;
top:262px;
left:1353px;
}




/*------------------------------------------------------------
PAGE PRODUCT
------------------------------------------------------------*/

#page-product{
width:1100px;
margin:0 auto;
padding:128px 0 74px;
}


.prd-ttl{
font-size:18px;
line-height:36px;
margin-bottom:20px;
}
.prd-ttl span{
font-size:16px;
font-family:'Noto Sans JP';
}

.prd-dtl-lx{
display:flex;
position:relative;
margin-bottom:203px;
}
.prd-dtl-sp,
.prd-dtl-msb,
.prd-dtl-gp2{
display:flex;
position:relative;
margin-bottom:114px;
}

.prd-txt{
margin:0;
}

.prd-name{
font-size:100px;
line-height:120px;
margin-bottom:24px;
}
.prd-copy{
font-size:24px;
margin-bottom:20px;
}
.prd-desc{
font-size:15px;
line-height:2;
margin-bottom:40px;
}
.dl-btn a{
display:block;
background:url(img/dl-btn.svg) no-repeat;
background-size:232px;
width:232px;
height:64px;
}

.prd-img-lx{
width:400px;
height:465px;
position:absolute;
top:-40px;
right:48px;
margin:0;
}
.prd-img-sp{
width:560px;
height:524px;
position:absolute;
top:-96px;
right:8px;
margin:0;
}
.prd-img-msb{
width:400px;
height:465px;
position:absolute;
top:-40px;
right:48px;
margin:0;
}
.prd-img-gp2{
width:360px;
height:485px;
position:absolute;
top:-72px;
right:152px;
margin:0;
}

.prd-mov-wrap{
width:800px;
margin:0 auto 110px;
}

.prd-mov{
width:100%;
height:0;
position: relative;
padding:0 0 56.25%;
}

.prd-mov iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


.prd-point{
width:840px;
margin:0 auto 101px;
}
.prd-point li{
padding-left:160px;
height:200px;
display:flex;
align-items:center;
position:relative;
font-size:14px;
margin:0;
}
.prd-point li:nth-child(1),
.prd-point li:nth-child(3){
margin-left:40px;
}
.prd-point li:nth-child(2){
margin-left:240px;
}

.p-bal{
width:200px;
height:200px;
background:rgba(61,95,150,.3);
border-radius:50%;
text-align:center;
display:flex;
flex-direction: column;
align-items:center;
justify-content:center;
color:#fff;
font-size:16px;
position:absolute;
top:0;
left:0;
}
.p-bal span{
font-size:72px;
line-height:1.2;
}

.pp-ttl{
font-weight:500;
font-size:21px;
margin-bottom:8px;
}
.pp-desc{
font-size:15px;
line-height:1.75;
}

.prd-bnr{
width:1000px;
margin:0 auto 115px;
}

.prd-data{
width:1000px;
margin:0 auto;
}
.prd-dataT{
width:100%;
border-collapse: separate;
border-spacing: 5px;
table-layout:fixed;
}
.prd-dataT thead th{
text-align:center;
font-size:19px;
border-bottom:4px solid #4d4d4d;
}

.prd-dataT thead th:nth-child(1){
width:26%;
}
.prd-dataT thead th:nth-child(2),
.prd-dataT thead th:nth-child(3){
width:37%;
}

.prd-dataT tbody th{
text-align:left;
font-size:14px;
line-height:1.9;
font-weight:500;
padding:11px;
}

.prd-dataT tbody tr:nth-child(odd){
background:#ebf0f0;
}

.prd-dataT tbody td{
text-align:center;
font-size:14px;
line-height:1.9;
padding:11px;
}



/* FUNCTION */

#page-function{
width:1100px;
margin:0 auto;
padding:145px 0 120px;
}

h2.page-func-ttl{
font-size:58px;
line-height:100px;
margin-bottom:58px;
}
h2.page-func-ttl span{
display:inline-block;
font-size:26px;
font-family:'Noto Sans JP';
font-weight:500;
margin-left:1em;
}

.func-list{
display:flex;
flex-wrap:wrap;
gap:44px 130px;
}
.func-list li{
width:280px;
display:block;
padding:0;
}
.func-list li h3{
text-align:center;
font-size:21px;
color:#647bb9;
margin-bottom:1em;
font-weight:600 !important;
}
.func-list li p{
font-size:14px;
margin:0 0 32px;
}


.func-img{
width:280px;
height:160px;
margin:0 auto;
display:flex;
align-items:center;
justify-content:center;
}
.func-txt{
width:auto;
}



#custom{
width:100%;
background:rgba(235,240,240,.75);
position:relative;
padding:60px 0 24px;
isolation: isolate;
}

.page-custom-inner{
width:1100px;
margin:0 auto;
}

.custom-list{
display:flex;
}
.cus-box-l{
width:363px;
padding-right:23px;
border-right:1px solid #0B75E1;
border-bottom:0;
padding-bottom:0;
}
.cus-box-c{
width:386px;
padding:0 23px;
border-right:1px solid #0B75E1;
border-bottom:0;
}
.cus-box-r{
width:363px;
padding:0 0 0 23px;
}

.cus-thumb{
position:relative;
margin-bottom:46px;
}
.cus-name{
width:100%;
font-size:22px;
color:#fff;
font-weight:500;
position:absolute;
bottom:32px;
text-align:center;
}

.cus-data{
}
.cus-data li{
padding:24px 0;
border-bottom:4px dotted #96b4c8;
}
.cus-data li:last-child{
border:0;
}

.cus-data li:nth-child(1){ height:190px;}
.cus-data li:nth-child(2){ height:140px;}
.cus-data li:nth-child(3){ height:190px;}

.cus-data-ttl{
font-size:21px;
line-height:1;
margin-bottom:1em;
color:#647bb9;
font-weight:600;
text-align:center;
}
.cus-data-desc{
width:280px;
margin:0 auto;
}





.cus-type{
font-size:256px;
line-height:1;
font-weight:normal;
color:#ebf0f0;
position:absolute;
bottom:28px;
right:0;
z-index:-1;
mix-blend-mode: multiply;
}


#option{
width:100%;
position:relative;
padding:88px 0 104px;
isolation: isolate;
}
.opt-list{
width:1100px;
margin:0 auto;
display:flex;
justify-content:center;
gap:40px;
flex-wrap:wrap;
}

.opt-list li{
width:340px;
height:200px;
border-radius:8px;
background:rgba(235,240,240,.75);
display:flex;
justify-content:center;
text-align:center;
align-items:center;
flex-direction:column;
padding:0;
}

.opt-ttl{
color:#647bb9;
font-size:21px;
line-height:1;
margin-bottom:1em;
font-weight:600;
}

.opt-type{
font-size:256px;
line-height:1;
color:#ebf0f0;
position:absolute;
bottom:11px;
left:0;
z-index:2;
mix-blend-mode: multiply;

font-weight:normal;
}




/*------------------------------------------------------------
PRODUCT FIXE LIST
------------------------------------------------------------*/


.fixed-list {
  position: fixed;
  top: 50%;
  right:16px;
  width: 100px;
  transform:translateY(-50%);
  transition: transform 0.3s ease;
  z-index: 1000;
}

.fixed-list.hide {
  transform: translate(120%, -50%);
}

.fixed-list li{
width:100px;
height:100px;
border:2px solid #ccc;
border-radius:6px;
box-shadow:0 0 5px #ccc;
margin-bottom:8px;
padding:5px;
display:flex;
justify-content:center;
align-items:center;
position:relative;
background:#fff;
}
.fixed-list li a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:10;
}
.fixed-list li.active{
border:1px solid #647bb9;
box-shadow:0 0 5px #647bb9;
}

.fixed-list li:hover{
border:1px solid #0b75e1;
box-shadow:0 0 5px #0b75e1;
}

.prd-stk-ttl{
width:80px;
font-size:14px;
text-align:left;
}
.prd-stk-ttl-txt{
font-size:13px;
text-align:center;
}

.prd-stk-img{
width:50px;
height:50px;
display:flex;
justify-content:center;
margin:0 auto;
}
.prd-stk-img img{
width:50px;
height:50px;
object-fit:cover;
}
.fixed-list li:nth-child(2) .prd-stk-img img{
width:60px;
height:60px;
object-fit:cover;
}

.prd-stk-btn{
position:fixed;
top:50%;
margin-top:276px;
right:20px;
z-index:100;
font-size:12px;
line-height:1.2;
display:flex;
align-items:center;
}
#toggleListBtn {
  width: 30px;
  height: 30px;
  cursor: pointer;
  padding: 0;
  background:#f5f5f5;
  border:1px solid #ccc;
  margin-left:8px;
}
#toggleListBtn::before {
  content: '';
  width:6px;
  height:6px;
  border-right:1px solid #444;
  border-bottom:1px solid #444;
  transform:rotate(-45deg);
  position:absolute;
  line-height: 40px;
  top:12px;
  right:12px;
}

.prd-stk-btn.hide #toggleListBtn::before {
  transform:rotate(135deg);
  top:12px;
  right:10px;
}



/*------------------------------------------------------------
PAGE APPLICATION
------------------------------------------------------------*/
#page-app{
padding:145px 0 120px;
}

#page-app h2{
width:1100px;
margin:0 auto;
font-size:80px;

line-height:96px;
margin-bottom:20px;
}

.app-head{
padding:68px 0 32px;
text-align:center;
position:relative;
}
.app-head::after{
content:'';
background:#f2f2f2;
width:100%;
height:333px;
position:absolute;
top:0;
left:0;
z-index:-1;
}


.app-head h3{
text-align:center;
font-size:38px;
line-height:1;
margin-bottom:1em;
}
.app-head h3 span{
color:#0b75e1;
}


.disp-type{
width:960px;
height:309px;
background:url(img/disp-type-bg.svg) no-repeat center top;
background-size:960px;
margin:0 auto;
display:flex;
justify-content:space-between;
padding:46px 16px 36px;
}

.disp-type li{
padding:0 56px;
height:169px;
border-right:1px solid #666;
text-align:center;
font-size:14px;
}
.disp-type li:last-child{
border:0;
}
.disp-img{
height:120px;
margin-bottom:20px;
}

.img-disp{
width:240px;
height:128px;
margin:46px auto 4px;
position:relative;
left:-4px;
}




.app-exp{
max-width:1100px;
height:3925px;
margin:0 auto;
position:relative;
background:url(img/line-dots-md.svg) no-repeat center top;
}


.app-exp svg {
  width: 100%;
  height: auto;
  display: block; /* インラインの隙間を防ぐ */
}

.svg-background{
display:none;
}

.svg-background-md {
  position: absolute;
  top: 0;
  left: 50%;
margin-left:-28px;
  transform: translateX(-50%);
  height: 100%;
  width: auto;
  z-index: 0;
  pointer-events: none; /* 背景がクリックを妨げないように */
display:block;
}
.svg-background-md svg {
  height: 3656px;
  width: auto;
}

.svg-background-sp,
.svg-background-pc {
display:none;
}

.disp-bal01,
.disp-bal02,
.disp-bal03,
.disp-bal04,
.disp-bal05,
.disp-bal06,
.disp-bal07,
.disp-bal08{
width:231px;
height:231px;
margin:0 auto 30px;
}
.disp-bal09{
width:289px;
height:289px;
margin:0 auto 30px;
}
.disp-bal10{
width:300px;
height:300px;
margin:0 auto 30px;
}
.disp-bal11,
.disp-bal12,
.disp-bal13,
.disp-bal14{
width:250px;
height:250px;
margin:0 auto 30px;
}
.disp-bal15{
width:400px;
height:400px;
margin:0 auto 30px;
}

.disp-txt01{
width:294px;
height: auto;
}

.disp-ttl{
text-align:center;
font-size:23px;
line-height:1;
margin-bottom:20px;
font-weight:500;
color:#809bc5;
}
.disp-box01,
.disp-box02,
.disp-box03,
.disp-box04,
.disp-box06,
.disp-box07,
.disp-box08{
font-size:16px;
line-height:24px;
width:294px;
height:100px;
display:flex;
align-items:center;
background:rgba(235,240,240,.75);
padding:0 25px;
}



.disp01{
width:294px;
height:400px;
position:absolute;
top:463px;
left:50%;
margin-left:-338px;
z-index:10;
display:block;
}

.disp02{
width:294px;
height:400px;
position:absolute;
top:637px;
left:50%;
margin-left:87px;
z-index:10;
}
.disp-box05{
font-size:16px;
line-height:24px;
width:314px;
height:100px;
display:flex;
align-items:center;
background:rgba(235,240,240,.75);
padding:0 25px;
}

.disp-bal02{
width:231px;
height:231px;
position:static;
}
.disp-txt02{
width:294px;
height:auto;
padding:0;
}

.disp03{
width:294px;
height:400px;
position:absolute;
top:1132px;
left:50%;
margin-left:285px;
z-index:10;
}
.disp-bal03{
position:static;
}
.disp-txt03{
width: 294px;
height: auto;
padding:0;
display:block;
}


.disp04{
width:294px;
height:400px;
position:absolute;
top:1092px;
left:50%;
margin-left:-150px;
z-index:10;
}
.disp-bal04{
position:static;
}
.disp-txt04{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp05{
width:314px;
height:400px;
position:absolute;
top:1035px;
left:50%;
margin-left:-516px;
z-index:10;
}

.disp-bal05{
position:static;
}
.disp-txt05{
width: 314px;
height: auto;
padding:0;
display:block;
}

.disp06{
width:294px;
height:400px;
position:absolute;
top:1522px;
left:50%;
margin-left:-428px;
z-index:10;
}

.disp-bal06{
position:static;
}
.disp-txt06{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp07{
width:294px;
height:400px;
position:absolute;
top:1588px;
left:50%;
margin-left:53px;
z-index:10;
}

.disp-bal07{
position:static;
}
.disp-txt07{
width: 294px;
height: auto;
padding:0;
display:block;
}


.disp08{
width:294px;
height:400px;
position:absolute;
top:2063px;
left:50%;
margin-left:28px;
z-index:10;
}

.disp-bal08{
position:static;
}
.disp-txt08{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp09{
width:294px;
height:400px;
position:absolute;
top:2452px;
left:50%;
margin-left:-486px;
z-index:10;
}

.disp-bal09{
position:static;
}
.disp-txt09{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp10{
width:300px;
height:400px;
position:absolute;
top:2490px;
left:50%;
margin-left:-88px;
z-index:10;
}

.disp-bal10{
position:static;
}
.disp-txt10{
width: 300px;
height: auto;
padding:0;
display:block;
}

.disp11{
width:294px;
height:400px;
position:absolute;
top:2680px;
left:50%;
margin-left:250px;
z-index:10;
}

.disp-bal11{
position:static;
}
.disp-txt11{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp12{
width:294px;
height:400px;
position:absolute;
top:3000px;
left:50%;
margin-left:40px;
z-index:10;
}

.disp-bal12{
position:static;
}
.disp-txt12{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp13{
width:294px;
height:400px;
position:absolute;
top:2955px;
left:50%;
margin-left:-400px;
z-index:10;
}

.disp-bal13{
position:static;
}
.disp-txt13{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp14{
width:294px;
height:400px;
position:absolute;
top:3470px;
left:50%;
margin-left:-246px;
z-index:10;
}

.disp-bal14{
position:static;
}
.disp-txt14{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp15{
width:400px;
height:500px;
position:absolute;
top:3470px;
left:50%;
margin-left:130px;
z-index:10;
}

.disp-bal15{
position:static;
}
.disp-txt15{
width: 400px;
height: auto;
padding:0;
display:block;
}


#line-solid-md {
  stroke: #00c0e7;   /* 線の色 */
  stroke-width: 4px; /* 線の太さ */
  fill: none;        /* 塗りを無効化 */
}



/*------------------------------------------------------------
PAGE Q&A
------------------------------------------------------------*/

#page-qa{
width:1000px;
margin:0 auto;
padding:128px 0 72px;
}
#page-qa h2{
font-size:58px;
line-height:1;
margin-bottom:40px;
}

.qa dt{
border:1px solid #b3b3b3;
font-size:26px;
line-height:34px;
padding:18px 51px;
position:relative;
margin-bottom:12px;
}
.qa dt::before{
content:'';
width:6px;
height:22px;
background:#b3b3b3;
position:absolute;
top:24px;
left:16px;
}
.qa dt::after{
content:'';
width:23px;
height:23px;
background:url(img/icon-plus.svg) no-repeat;
background-size:23px;
position:absolute;
top:24px;
right:12px;
}
.qa dt.open::after{
content:'';
width:23px;
height:4px;
background:url(img/icon-minus.svg) no-repeat;
background-size:23px;
position:absolute;
top:33px;
right:12px;
}

.qa dd{
display:none;
font-size:14px;
line-height:29px;
margin-bottom:48px;
}

/*------------------------------------------------------------
PAGE DOWNLOADS
------------------------------------------------------------*/
#page-dl{
width:1000px;
margin:0 auto;
padding:128px 0 120px;
}
#page-dl h2{
font-size:58px;
line-height:1;
margin-bottom:40px;
}
#page-dl h2 span{
margin-left:1em;
font-size:26px;
font-weight:normal;
display:inline-block;
}

.dl-desc{
font-size:16px;
line-height:20px;
margin:0 0 78px;
}

.dl-desc2{
font-size:16px;
line-height:20px;
margin:0 0 32px;
}
.dl-list{
width:860px;
display:flex;
justify-content:space-between;
}
.dl-list li{
display:flex;
flex-direction:column;
justify-content:flex-end;
position:relative;
}
.dl-list li:nth-child(1){
width:272px;
}
.dl-list li:nth-child(2){
width:456px;
}
.dl-img{
margin:0 0 50px;
}
.dl-img img{
border:1px solid #ccc;
}

.dl-ttl{
font-size:18px;
line-height:32px;
}
.dl-list li a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}

#page-dl h3{
font-size:32px;
font-weight:500;
line-height:1;
padding:0 0 32px 22px;
border-bottom:2px solid #b3b3b3;
position:relative;
margin: 0 0 32px;
}
#page-dl h3::before{
content:'';
width:8px;
height:27px;
background:#b3b3b3;
position:absolute;
top:3px;
left:0;
}

.chk-wrap{
font-size:21px;
line-height:48px;
margin-bottom:95px;
}
.form-cap{
}

.form-info{
width:100%;
height:100px;
border:1px solid #b3b3b3;
display:flex;
align-items:center;
font-size:21px;
padding:0 0 0 20px;
margin:0 auto 32px;
}

.form-info span{
color:#0B75E1;
}

.input-wrap{
display:flex;
justify-content:space-between;
margin:0 0 25px;
align-items:center;
}
.input-item{
width:270px;
display:flex;
font-size:21px;
align-items:flex-start;
}
.req{
color:#0B75E1;
margin-right:1em;
}
.non-req{
color:transparent;
margin-right:1em;
}
.input-form{
width:700px;
font-size:21px;
}

#page-dl input[type="text"],
#page-dl input[type="email"]{
width:100%;
background:#f2f2f2;
font-size:21px;
line-height:32px;
padding:21px;
border:0;
box-sizing:border-box;
}

.pp-chk{
display:flex;
justify-content:center;
margin:50px 0;
}

.pp-chk a{
color:#0B75E1;
text-decoration:underline;
}


.formBtn {
display:flex;
justify-content:center;
align-items:center;
}
.formBtn li {
display:inline-block;
margin:0 10px;
font-size:18px;
}


.mw_wp_form_confirm .sbmBtn input:hover,
.mw_wp_form_input .sbmBtn input:hover,
#submitback input:hover{
background:#0B75E1;
color:#fff;
}


.mw_wp_form_input .sbmBtn input {
background:#4d4d4d;
color:#fff;
width:400px;
height:65px;
overflow:hidden;
border:none;
cursor:pointer;
transition:all 0.2s;
-webkit-appearance: none;
}
.mw_wp_form_confirm .sbmBtn input {
background:#4d4d4d;
color:#fff;
width:400px;
height:65px;
overflow:hidden;
border:none;
cursor:pointer;
transition:all 0.2s;
-webkit-appearance: none;
}
.backBtn input {
background:#999;
color:#fff;
width:80px;
height:65px;
overflow:hidden;
border:none;
cursor:pointer;
margin-right:10px;
transition:all 0.2s;
-webkit-appearance: none;
}


.mw_wp_form_confirm .form-info,
.mw_wp_form_confirm .form-cap{ display:none; }

.mw_wp_form_confirm .chk-wrap{
margin:0 0 32px;

}
.mw_wp_form_confirm .req{
color:transparent;
}
.mw_wp_form_confirm .dl-desc2{
margin-bottom:75px;
}


/*------------------------------------------------------------
PAGE CONTACT
------------------------------------------------------------*/
#page-contact{
width:1000px;
margin:0 auto;
padding:160px 0 150px;
}
#page-contact h2{
font-size:72px;
line-height:1;
margin-bottom:50px;
}
#page-contact h2 span{
margin-left:1em;
font-size:32px;
font-weight:normal;
display:inline-block;
}
#page-contact h3{
font-size:32px;
font-weight:500;
line-height:1;
padding:0 0 32px 22px;
border-bottom:2px solid #b3b3b3;
position:relative;
margin: 0 0 32px;
}
#page-contact h3::before{
content:'';
width:8px;
height:27px;
background:#b3b3b3;
position:absolute;
top:3px;
left:0;
}

#page-contact input[type="text"],
#page-contact input[type="email"]{
width:100%;
background:#f2f2f2;
font-size:21px;
line-height:32px;
padding:21px;
border:0;
-webkit-appearance:none;
box-sizing:border-box;
}
#page-contact textarea{
width:100%;
background:#f2f2f2;
height:250px;
padding:21px;
border:none;
-webkit-appearance:none;
box-sizing:border-box;
}


.mwform-tel-field input[type="text"] {
width:25% !important;
-webkit-appearance: none;
}



/*------------------------------------------------------------
CATEGORY ARCHIVE
------------------------------------------------------------*/
#cat{
width:1000px;
margin:0 auto;
padding:128px 0 116px;
}

#cat h2{
font-size:58px;
line-height:1;
margin-bottom:40px;
}
#cat h2 span{
margin-left:1em;
font-size:26px;
font-weight:normal;
display:inline-block;
}


/*------------------------------------------------------------
POST SINGLE
------------------------------------------------------------*/
#single{
width:1000px;
margin:0 auto;
padding:128px 0 116px;
}

#single h2{
font-size:58px;
line-height:1;
margin-bottom:40px;
}
#single h2 span{
margin-left:1em;
font-size:26px;
font-weight:normal;
display:inline-block;
}

.post-ttl-area{
border-top:1px solid #b2b2b2;
padding:16px 12px;
border-bottom:4px solid #b2b2b2;
margin-bottom:60px;
}

.post-info{
font-size:18px;
line-height:25px;
display:flex;
gap:0 24px;
align-items:center;
margin-bottom:16px;
}

.post-cat{
width:180px;
color:#0B75E1;
display:inline-block;
padding:5px 30px;
border:1px solid #0B75E1;
border-radius:23px;
text-align:center;
}


.post-date{
width:100px;
}
.post-ttl{
font-size:29px;
line-height:38px;
}
.post-content{
font-size:15px;
line-height:1.75;
margin-bottom:120px;
}
.post-content p{
margin-bottom:1.5em;
}
.post-content img{
margin:1em 0;
}

.paging{
display:flex;
justify-content:space-between;
font-size:18px;
align-items:center;
}

.prevP{
position:relative;
width:120px;
height:36px;
padding-left:55px;
margin:0 20px;
}
.nextP{
width:120px;
padding-right:55px;
text-align:right;
position:relative;
height:36px;
margin:0 20px;
}

.prevP::before{
content:'';
width:36px;
height:36px;
background:url(img/arrow-circle-gray-l.svg) no-repeat;
background-size:36px;
position:absolute;
top:0;
left:0;
}
.nextP::before{
content:'';
width:36px;
height:36px;
background:url(img/arrow-circle-gray.svg) no-repeat;
background-size:36px;
position:absolute;
top:0;
right:0;
}


.non-post{
width:120px;
margin:0 20px;
}
.go-arc{
width:140px;
height:36px;
padding-left:55px;
position:absolute;
margin:0 20px;
top:0;
left:50%;
transform:translate(-50%, 0);
}
.go-arc::before{
content:'';
width:36px;
height:36px;
background:url(img/arrow-circle-gray-l.svg) no-repeat;
background-size:36px;
position:absolute;
top:0;
left:0;
}

.prevP a,
.nextP a,
.go-arc a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}

.prevP:hover,
.nextP:hover,
.go-arc:hover{
color:#0B75E1;
}



/*------------------------------------------------------------
FOOTER
------------------------------------------------------------*/
footer{
background:#f0f0f0;
}


.footer-inner{
padding:51px 0 42px;
width:1100px;
margin:0 auto;
display:flex;
justify-content:space-between;
align-items:center;
}


.f-logo{
position:relative;
width:120px;
margin:0;
}
.f-logo a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}
.f-sitemap{
width:660px;
margin:0;
display:flex;
justify-content:flex-end;
}
.fs01{
width:118px;
}
.fs02{
width:264px;
}
.fs03{
width:132px;
}
.fs04{
width:130px;
}

.fs-menu li a,
.fs-menu li.nolink{
color:#4d4d4d;
font-size:16px;
line-height:30px;
}

.fs-sub{
display:flex;
flex-wrap:wrap;
}
.fs-sub li{
padding-left:25px;
position:relative;
}
.fs-sub li:nth-child(odd){
width:100px;
}
.fs-sub li:nth-child(even){
width:164px;
}
.fs-sub li::before{
content:'';
width:6px;
height:6px;
border-left:1px solid #4d4d4d;
border-bottom:1px solid #4d4d4d;
transform:rotate(-135deg);
position:absolute;
top:12px;
left:8px;
}
.fs-sub li.fs-blank::before{
content:none;
}

.fs-menu li a:hover,
.fs-sub li a:hover{
color:#0b75e1;
}

.copy{
border-top:1px solid #cacaca;
text-align:center;
font-size:16px;
line-height:70px;
height:70px;
width:auto;
}

/*------------------------------------------------------------
END MID PC LAYOUT CSS
------------------------------------------------------------*/
}



@media (min-width:1024px) {

#top{
padding:0;
}

.sp-hum,
.t-only{
display:none;
}

header{
width:100%;
height:70px;
position:fixed;
top:0;
left:0;
z-index:999;
background:#f0f0f0;
}
.header-inner{
min-width:1000px;
display:flex;
justify-content:space-between;
align-items:center;
padding:0;
}
.site-logo{
width:200px;
height:47px;
margin:0 0 0 2%;
position:relative;
}
.site-logo a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}

.pc-head,
.kv-head,
.p-head{
display:block;
}

.head-navi{
width:780px;
display:flex;
}
.h-navi-wh{
width:525px;
display:flex;
align-items:center;
justify-content:space-between;
}
.h-navi-wh li{

}
.h-navi-wh li a{
font-size:16px;
display:block;
color:#fff;
}


.h-navi-wh li:first-child a{
padding-left:30px;
}
.h-navi-wh li:last-child a{
padding-right:30px;
}

.icon-nav-wh{
width:141px;
display:flex;
}
.icon-nav-wh li{
width:70px;
height:70px;
display:flex;
justify-content:center;
align-items:center;
border-right:1px solid transparent;
}
.icon-nav-wh li:last-child{
border:0;
}

.icon-lang-wh{
background:url(img/icon-globe-wh.svg) no-reepat center center;
background-size:20px;
}
.icon-c-wh{
background:url(img/icon-mail-wh.svg) no-reepat center center;
background-size:20px;
}



.lang-sw{
display:none;
}



.p-header{
width:100%;
height:auto;
position:fixed;
top:0;
left:0;
background:#f0f0f0;
transform:translateY(-70px);
transition:all .2s;
z-index:999;
}

.is-fixed .p-header{
transform:translateY(0);
}

.h-navi{
width:600px;
display:flex;
align-items:center;
justify-content:space-between;
}

.h-navi li{

}
.h-navi li a{
font-size:16px;
line-height:70px;
display:block;
color:#4d4d4d;
}
.h-navi li a:hover{
color:#0b75e1;
}


.h-navi li:first-child a{
padding-left:30px;
}
.h-navi li:last-child a{
padding-right:30px;
}

.h-navi li > div {
  display: none;
}

.icon-nav{
width:180px;
display:flex;
}
.icon-nav li{
width:60px;
height:70px;
display:flex;
justify-content:center;
align-items:center;
}

.icon-yt-bk a,
.icon-lang-bk a,
.icon-c-bk a{
width:60px;
height:70px;
display:block;
}


.icon-yt-bk{
width:60px;
height:70px;
background:url(img/icon-yt-bk.svg) no-repeat center center;
background-size:20px;
}
.icon-lang-bk{
width:60px;
height:70px;
background:url(img/icon-globe-bk.svg) no-repeat center center;
background-size:20px;
}
.icon-c-bk{
width:60px;
height:70px;
background:url(img/icon-mail-bk.svg) no-repeat center center;
background-size:20px;
}

.h-sub-wrap{
width:100%;
height:195px;
background:#f0f0f0;
position:absolute;
top:70px;
left:0;
border-top:5px solid #fff;
display:flex;
justify-content:flex-end;
padding:20px 0;
}

.h-sub-nav{
width:590px;
margin-right:200px;
display:flex;
align-items:center;
}
.h-sub-ttl{
width:213px;
font-size:24px;
color:#0b75e1;
}
.h-sub{
width:180px;
padding:0 20px;
border-left:1px solid #0b75e1;
border-right:1px solid #0b75e1;

}
.h-sub li a{
color:#0b75e1;
font-size:21px;
line-height:36px;
padding-left:20px !important;
position:relative;
}
.h-sub li a::before{
content:'';
width:6px;
height:6px;
border-left:1px solid #0b75e1;
border-bottom:1px solid #0b75e1;
transform:rotate(-135deg);
position:absolute;
top:16px;
left:2px;
}
.h-sub li a:hover,
.h-sub-2 li a:hover{
color:#0b75e1;
}


.h-sub-2{
width:195px;
padding:0 20px;
display:flex;
align-self:flex-start;
flex-wrap:wrap;
}

.h-sub-2 li a{
color:#0b75e1;
font-size:21px;
line-height:36px;
padding-left:20px !important;
position:relative;
}

.h-sub-2 li a::before{
content:'';
width:6px;
height:6px;
border-left:1px solid #0b75e1;
border-bottom:1px solid #0b75e1;
transform:rotate(-135deg);
position:absolute;
top:16px;
left:2px;
}


.kv-header{
width:100%;
height:70px;
position:absolute;
top:0;
left:0;
z-index:999;
background:rgba(255,255,255,.75);
transition:all .2s;
}



.kv-header-inner{
min-width:1000px;
display:flex;
justify-content:space-between;
align-items:center;
padding:0;
}
.kv-site-logo{
width:200px;
height:47px;
margin:0 0 0 2%;
position:relative;
}
.kv-site-logo a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}

.kv-h-sub-wrap{
width:100%;
height:195px;
background:rgba(255,255,255,.75);
position:absolute;
top:70px;
left:0;
border-top:5px solid rgba(255,255,255,.8);
display:flex;
justify-content:flex-end;
padding:20px 0;
}



}






@media screen and (min-width:1420px){

body{
color:#4d4d4d;
font-size:18px;
line-height:1.75;
width:100%;
overflow:hidden;
font-feature-settings:'palt';
}


/*------------------------------------------------------------
TOP PAGE CONTENT
------------------------------------------------------------*/

#index1{
position:relative;
padding:329px 0 351px;
height:1427px;
}

.i1-inner{
width:1400px;
margin:0 auto;
}
.i1-cont{
width:820px;
margin:285px 0 0 580px;

}
.i1-cont h2{
font-size:51px;
line-height:1.5;
margin-bottom:1em;
}
.i1-cont p{
font-size:22px;
}

.bg-type{
width:100%;
white-space:nowrap;
overflow:hidden;
font-size:253px;
line-height:280px;
color:#f1f1f1;
position:absolute;
top:350px;
left:0;
z-index:-1;
}


#index2{
width:1400px;
margin:0 auto;
padding:0 0 314px;
}

#index2 h2{
font-size:100px;

line-height:120px;
margin-bottom:80px;
}
#index2 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:18px;
line-height:1.2;
}

.top-prd{
display:flex;
justify-content:space-between;
}
.top-prd li{
width:326px;
}
.p-wrap{
background:#f1f1f1;
padding:20px;
margin-bottom:20px;
transition:all .2s;
}

.top-prd li:hover .p-wrap{
background:#ebf1f7;
}

.p-type{
color:#0B75E1;
font-size:34px;
}
.p-thumb{
display:flex;
justify-content:center;
align-items:center;
text-align:center;
width:260px;
margin:34px auto 47px;
height:242px;
}

.p-det{
display:flex;
justify-content:space-between;
}
.p-size{
width:70px;
display:flex;
}
.p-size li{
width:32px;
height:32px;
}
.size-m{
width:32px;
height:32px;
background:#0B75E1;
border-radius:50%;
color:#fff;
font-size:14px;
line-height:32px;
margin-right:6px;
text-align:center;
}
.size-l{
width:32px;
height:32px;
background:#989898;
border-radius:50%;
color:#fff;
font-size:14px;
line-height:32px;
text-align:center;
}

.p-link{
width:32px;
height:32px;
border:2px solid #989898;
position:relative;
border-radius:50%;
display:block;
}
.p-link::after{
content:'';
width:8px;
height:8px;
border-right:2px solid #989898;
border-bottom:2px solid #989898;
transform:rotate(-45deg);
position:absolute;
top:9px;
right:10px;
}
.p-desc{
font-size:18px;
font-weight:500;
margin:0;
}


#index3{
padding:0 0 297px;
}

#index3 h2{
width:1400px;
margin:0 auto;
font-size:100px;

line-height:120px;
margin-bottom:80px;
}
#index3 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:18px;
line-height:1.2;
}

.banner-wrapper {
overflow: hidden;
position: relative;
height: 620px;
padding:0;
}

.banner-wrapper a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:10;
}

.banner-track {
display: flex;
animation: scrollLeft 30s linear infinite;
width: max-content;
}
.banner-item {
flex: 0 0 auto;
width: 310px;
height: 620px;
background:linear-gradient(-45deg, rgba(34,82,136,.64) 0%, rgba(67,94,148,.5) 33%, rgba(85,150,157,.2) 66%, rgba(85,150,157,.05) 100%);
}
.banner-item img {
width: 100%;
height: 100%;
object-fit: cover;
}

@keyframes scrollLeft {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}


#index4{
width:1400px;
margin:0 auto;
padding:0 0 267px;
}

#index4 h2{
font-size:100px;

line-height:120px;
margin-bottom:80px;
}
#index4 h2 span{
display:block;
font-family:'Noto Sans JP';
font-size:18px;
line-height:1.2;
}
.top-about-img img{
transition:all .2s;
}
.top-about-img a:hover img{
opacity:.8;
}

#index5{
width:1400px;
margin:0 auto;
padding:0 0 235px;
}

#index5 h2{
width:auto;
font-size:100px;

line-height:120px;
margin-bottom:100px;
}

.feed{
border-top:1px solid #b2b2b2;
}

.feed li{
padding:20px;
border-bottom:1px solid #b2b2b2;
position:relative;
}

.feed-info{
display:flex;
font-size:18px;
line-height:25px;
}

.feed-date{
width:100px;
}
.feed-cat{
width:200px;
}

.feed-ttl{
font-size:18px;
line-height:25px;
}

.feed-link{
display:flex;
justify-content:flex-end;
margin-bottom:15px;
}
.feed-link a{
padding-left:40px;
position:relative;
font-size:18px;
line-height:30px;
color:#4d4d4d;
}
.feed-link a::before{
content:'';
width:30px;
height:30px;
background:url(img/arrow-circle-gray.svg) no-repeat;
background-size:30px;
position:absolute;
top:0;
left:0;
}
.feed-link a:hover{
color:#0B75E1;
}
.feed li:hover .feed-ttl{
color:#0B75E1;
}

.feed li a{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:block;
z-index:2;
}

/*------------------------------------------------------------
PAGE ABOUT
------------------------------------------------------------*/
#page-about{
width:100%;
padding:200px 0 67px;
}

.head-about{
width:100%;
display:flex;
position:relative;
margin-bottom:200px;
}
.head-about-img{
width:50%;
height:500px;
background:url(img/about01.jpg) no-repeat center center;
background-size:cover;
margin:0;
}

.head-about-ttl{
width:50%;
display:flex;
justify-content:center;
padding:0;
margin:0;
}
.head-about-ttl h2{
width:auto;
font-size:180px;
line-height:190px;

position:absolute;
top:20px;
left:50%;
margin-left:-140px;
white-space:nowrap;
text-align:center;
margin-bottom:0;
}
.head-about-ttl h2 span{
display:block;
font-size:32px;
line-height:1.2;
font-family:'Noto Sans JP';
}
.head-about-ttl p{
font-size:18px;
line-height:31px;
padding:338px 0 0;
margin:0;
}


.about-cont01{
width:100%;
position:relative;
margin:0 0 240px;
display:flex;
}
.about-cont01-img{
width:50%;
height:575px;
background:url(img/about02.jpg) no-repeat center;
background-size:cover;
}
.about-cont01-txt{
display:flex;
width:50%;
justify-content:flex-center;
padding:0;
}
.about-cont01-txt-inner{
margin-bottom:0;
}

.about-cont01-txt h3{
font-size:100px;
line-height:118px;

text-align:center;
margin:0 0 52px;
}
.about-cont01-txt h3 span{
display:block;
font-size:36px;
line-height:1.3 !important;
font-weight:normal;
}

.about-md-sub{
font-size:1.98vw;
line-height:1;
text-align:center;
margin:0 0 90px;
white-space:nowrap;
font-weight:500;
}
.about-md-sub span{
color:#0B75E1;
}
.about-cont01-txt p{
width:561px;
margin:0 auto;
font-size:18px;
line-height:31px;
}

.about-cont02{
width:100%;
margin:0 auto 210px;
}
.about-cont02 h2{
font-size:100px;
line-height:1;
margin-bottom:35px;

text-align:center;
}

.about-cont02-img{
width:100%;
height:0;
padding-bottom:24.8%;
background:url(img/about03.jpg) no-repeat center center;
background-size:cover;
margin-bottom:23px;
}

.office-list{
max-width:1400px;
margin:0 auto;
display:flex;
justify-content:space-between;
}
.office-list li{
width:675px;
font-size:16px;
line-height:28px;
margin:0;
}
.office-txt{
border-left:2px solid #b3b3b3;
padding:40px 50px 0;
min-height:375px;
margin-bottom:50px;
}

.office-list li h3{
font-size:36px;
line-height:1;
margin-bottom:50px;
}
.office-list li p{
margin-bottom:1.5em;
}

.page-link a{
color:#4d4d4d;
position:relative;
display:inline-block;
padding-right:26px;
line-height:1.75;
}
.page-link a::after{
content:'';
width:20px;
height:20px;
background:url(img/arrow-circle-gray.svg) no-repeat;
background-size:20px;
position:absolute;
right:0;
top:5px;
}

.page-link a:hover{
color:#0B75E1;
}
.page-link a:hover::after{
right:-2px;
}

.office-thumb{
width:675px;
height:400px;
background:#f0f0f0;
}

.about-cont03{
width:100%;
}

.about-cont03 h2{
width:1400px;
margin:0 auto 40px;
font-size:100px;

line-height:1.2;
}
.about-cont03 h2 span{
display:block;
font-size:32px;
}


.his-md-wrap{
width:100%;
overflow:visible;
}

.history-wrap{
width:100%;
height:620px;
background:url(img/history-line.jpg) no-repeat center bottom;
}

/*------------------------------------------------------------
PAGE PRODUCT
------------------------------------------------------------*/

#page-product{
width:1400px;
margin:0 auto;
padding:164px 0 95px;
}


.prd-ttl{
font-size:18px;
line-height:36px;
margin-bottom:20px;
}
.prd-ttl span{
font-size:16px;
font-family:'Noto Sans JP';
}


.prd-dtl-lx{
display:flex;
position:relative;
margin-bottom:254px;
}
.prd-dtl-sp,
.prd-dtl-msb,
.prd-dtl-gp2{
display:flex;
position:relative;
margin-bottom:143px;
}

.prd-txt{
margin:0;
}

.prd-name{
font-size:125px;
line-height:150px;
margin-bottom:30px;
}
.prd-copy{
font-size:30px;
margin-bottom:25px;
}
.prd-desc{
font-size:18px;
line-height:2;
margin-bottom:50px;
}
.dl-btn a{
display:block;
background:url(img/dl-btn.svg) no-repeat;
background-size:290px;
width:290px;
height:80px;
}

.prd-img-lx{
width:500px;
height:581px;
position:absolute;
top:-50px;
right:60px;
margin:0;
}
.prd-img-sp{
width:700px;
height:654px;
position:absolute;
top:-120px;
right:10px;
margin:0;
}
.prd-img-msb{
width:500px;
height:581px;
position:absolute;
top:-50px;
right:60px;
margin:0;
}
.prd-img-gp2{
width:450px;
height:606px;
position:absolute;
top:-90px;
right:190px;
margin:0;
}



.prd-mov-wrap{
width:1000px;
margin:0 auto 137px;
}

.prd-point{
width:1050px;
margin:0 auto 126px;
}
.prd-point li{
padding-left:200px;
height:250px;
display:flex;
align-items:center;
position:relative;
font-size:17.6px;
margin:0;
}
.prd-point li:nth-child(1),
.prd-point li:nth-child(3){
margin-left:50px;
}
.prd-point li:nth-child(2){
margin-left:300px;
}

.p-bal{
width:250px;
height:250px;
background:rgba(61,95,150,.3);
border-radius:50%;
text-align:center;
display:flex;
flex-direction: column;
align-items:center;
justify-content:center;
color:#fff;
font-size:20px;
position:absolute;
top:0;
left:0;
}
.p-bal span{
font-size:90px;
line-height:1.2;
}

.pp-ttl{
font-weight:500;
font-size:26px;
margin-bottom:10px;
}
.pp-desc{
font-size:18px;
line-height:1.75;
}


.prd-bnr{
width:1250px;
margin:0 auto 115px;
}

.prd-data{
width:1250px;
margin:0 auto;
}
.prd-dataT{
width:100%;
border-collapse: separate;
border-spacing: 5px;
table-layout:fixed;
}
.prd-dataT thead th{
text-align:center;
font-size:24px;
border-bottom:4px solid #4d4d4d;
}

.prd-dataT thead th:nth-child(1){
width:26%;
}
.prd-dataT thead th:nth-child(2),
.prd-dataT thead th:nth-child(3){
width:37%;
}

.prd-dataT tbody th{
text-align:left;
font-size:16px;
line-height:1.9;
font-weight:500;
padding:11px;
}

.prd-dataT tbody tr:nth-child(odd){
background:#ebf0f0;
}

.prd-dataT tbody td{
text-align:center;
font-size:16px;
line-height:1.9;
padding:11px;
}






/* FUNCTION */

#page-function{
width:1410px;
margin:0 auto;
padding:182px 0 150px;
}

h2.page-func-ttl{
font-size:72px;
line-height:126px;
margin-bottom:72px;
}
h2.page-func-ttl span{
display:inline-block;
font-size:32px;
font-family:'Noto Sans JP';
font-weight:500;
margin-left:1em;
}

.func-list{
display:flex;
flex-wrap:wrap;
gap:55px 180px;
}
.func-list li{
width:350px;
display:block;
padding:0;
}
.func-list li h3{
text-align:center;
font-size:26px;
color:#647bb9;
margin-bottom:1em;
font-weight:600 !important;
}
.func-list li p{
font-size:16px;
margin:0 0 40px;
}


.func-img{
width:350px;
height:200px;
margin:0 auto;
display:flex;
align-items:center;
justify-content:center;
}
.func-txt{
width:auto;
}



#custom{
width:100%;
background:rgba(235,240,240,.75);
position:relative;
padding:75px 0 30px;
isolation: isolate;
}

.page-custom-inner{
width:1400px;
margin:0 auto;
}

.custom-list{
display:flex;
}
.cus-box-l{
width:454px;
padding-right:29px;
border-right:1px solid #0B75E1;
border-bottom:0;
padding-bottom:0;
}
.cus-box-c{
width:483px;
padding:0 29px;
border-right:1px solid #0B75E1;
border-bottom:0;
}
.cus-box-r{
width:454px;
padding:0 0 0 29px;
}

.cus-thumb{
position:relative;
margin-bottom:57px;
}
.cus-name{
width:100%;
font-size:28px;
color:#fff;
font-weight:500;
position:absolute;
bottom:40px;
text-align:center;
}

.cus-data{
}
.cus-data li{
padding:30px 0;
border-bottom:4px dotted #96b4c8;
}
.cus-data li:last-child{
border:0;
}

.cus-data li:nth-child(1){ height:238px;}
.cus-data li:nth-child(2){ height:175px;}
.cus-data li:nth-child(3){ height:238px;}

.cus-data-ttl{
font-size:26px;
line-height:1;
margin-bottom:1em;
color:#647bb9;
font-weight:600;
text-align:center;
}
.cus-data-desc{
width:350px;
margin:0 auto;
}





.cus-type{
font-size:320px;
line-height:1;
font-weight:normal;
color:#ebf0f0;
position:absolute;
bottom:36px;
right:0;
z-index:-1;
mix-blend-mode: multiply;
}


#option{
width:100%;
position:relative;
padding:110px 0 130px;
isolation: isolate;
}
.opt-list{
width:1400px;
margin:0 auto;
display:flex;
justify-content:center;
gap:61px;
flex-wrap:wrap;
}

.opt-list li{
width:425px;
height:250px;
border-radius:8px;
background:rgba(235,240,240,.75);
display:flex;
justify-content:center;
text-align:center;
align-items:center;
flex-direction:column;
padding:0;
}

.opt-ttl{
color:#647bb9;
font-size:26px;
line-height:1;
margin-bottom:1em;
font-weight:600;
}

.opt-type{
font-size:320px;
line-height:1;
color:#ebf0f0;
position:absolute;
bottom:14px;
left:0;
z-index:2;
mix-blend-mode: multiply;

font-weight:normal;
}

/*------------------------------------------------------------
PAGE APPLICATION
------------------------------------------------------------*/
#page-app{
padding:182px 0 150px;
}

#page-app h2{
width:1500px;
margin:0 auto;
font-size:100px;

line-height:120px;
margin-bottom:25px;
}

.app-head{
padding:85px 0 40px;
text-align:center;
position:relative;
}
.app-head::after{
content:'';
background:#f2f2f2;
width:100%;
height:417px;
position:absolute;
top:0;
left:0;
z-index:-1;
}


.app-head h3{
text-align:center;
font-size:48px;
line-height:1;
margin-bottom:1em;
}
.app-head h3 span{
color:#0b75e1
}


.disp-type{
width:1200px;
height:386px;
background:url(img/disp-type-bg.svg) no-repeat center top;
background-size:1200px;
margin:0 auto;
display:flex;
justify-content:space-between;
padding:58px 20px 45px;
}

.disp-type li{
padding:0 70px;
height:206px;
border-right:1px solid #666;
text-align:center;
font-size:16px;
}
.disp-type li:last-child{
border:0;
}
.disp-img{
height:150px;
margin-bottom:25px;
}

.img-disp{
width:300px;
height:160px;
margin:58px auto 4px;
position:relative;
left:-4px;
}




.app-exp{
max-width:1600px;
height:3420px;
margin:0 auto;
position:relative;
background:url(img/line-dots.svg) no-repeat center top;
}


.app-exp svg {
  width: 100%;
  height: auto;
  display: block; /* インラインの隙間を防ぐ */
}
.svg-background-pc {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  width: auto;
  z-index: 0;
  pointer-events: none; /* 背景がクリックを妨げないように */
display:block;
}
.svg-background-pc svg {
  height: 3420px;
  width: auto;
}
.svg-background-sp,
.svg-background-md {
display:none;
}


.disp01{
width:294px;
height:400px;
position:absolute;
top:485px;
left:50%;
margin-left:-206px;
z-index:10;
display:block;
}
.disp-bal01,
.disp-bal02,
.disp-bal03,
.disp-bal04,
.disp-bal05,
.disp-bal06,
.disp-bal07,
.disp-bal08{
width:231px;
height:231px;
margin:0 auto 30px;
}
.disp-bal09{
width:289px;
height:289px;
margin:0 auto 30px;
}
.disp-bal10{
width:300px;
height:300px;
margin:0 auto 30px;
}
.disp-bal11,
.disp-bal12,
.disp-bal13,
.disp-bal14{
width:250px;
height:250px;
margin:0 auto 30px;
}
.disp-bal15{
width:400px;
height:400px;
margin:0 auto 30px;
}

.disp-txt01{
width:294px;
height: auto;
}

.disp-ttl{
text-align:center;
font-size:23px;
line-height:1;
margin-bottom:20px;
font-weight:500;
color:#809bc5;
}
.disp-box01,
.disp-box02,
.disp-box03,
.disp-box04,
.disp-box06,
.disp-box07,
.disp-box08{
font-size:16px;
line-height:24px;
width:294px;
height:100px;
display:flex;
align-items:center;
background:rgba(235,240,240,.75);
padding:0 25px;
}
.disp02{
width:294px;
height:400px;
position:absolute;
top:553px;
left:50%;
margin-left:174px;
z-index:10;
}
.disp-box05{
font-size:16px;
line-height:24px;
width:314px;
height:100px;
display:flex;
align-items:center;
background:rgba(235,240,240,.75);
padding:0 25px;
}

.disp-bal02{
width:231px;
height:231px;
position:static;
}
.disp-txt02{
width:294px;
height:auto;
padding:0;
}

.disp03{
width:294px;
height:400px;
position:absolute;
top:1065px;
left:50%;
margin-left:495px;
z-index:10;
}
.disp-bal03{
position:static;
}
.disp-txt03{
width: 294px;
height: auto;
padding:0;
display:block;
}


.disp04{
width:294px;
height:400px;
position:absolute;
top:1045px;
left:50%;
margin-left:110px;
z-index:10;
}
.disp-bal04{
position:static;
}
.disp-txt04{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp05{
width:314px;
height:400px;
position:absolute;
top:990px;
left:50%;
margin-left:-306px;
z-index:10;
}

.disp-bal05{
position:static;
}
.disp-txt05{
width: 314px;
height: auto;
padding:0;
display:block;
}

.disp06{
width:294px;
height:400px;
position:absolute;
top:933px;
left:50%;
margin-left:-710px;
z-index:10;
}

.disp-bal06{
position:static;
}
.disp-txt06{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp07{
width:294px;
height:400px;
position:absolute;
top:1392px;
left:50%;
margin-left:-554px;
z-index:10;
}

.disp-bal07{
position:static;
}
.disp-txt07{
width: 294px;
height: auto;
padding:0;
display:block;
}


.disp08{
width:294px;
height:400px;
position:absolute;
top:1450px;
left:50%;
margin-left:-88px;
z-index:10;
}

.disp-bal08{
position:static;
}
.disp-txt08{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp09{
width:294px;
height:400px;
position:absolute;
top:2128px;
left:50%;
margin-left:-760px;
z-index:10;
}

.disp-bal09{
position:static;
}
.disp-txt09{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp10{
width:300px;
height:400px;
position:absolute;
top:2294px;
left:50%;
margin-left:-164px;
z-index:10;
}

.disp-bal10{
position:static;
}
.disp-txt10{
width: 300px;
height: auto;
padding:0;
display:block;
}

.disp11{
width:294px;
height:400px;
position:absolute;
top:2447px;
left:50%;
margin-left:432px;
z-index:10;
}

.disp-bal11{
position:static;
}
.disp-txt11{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp12{
width:294px;
height:400px;
position:absolute;
top:2775px;
left:50%;
margin-left:-256px;
z-index:10;
}

.disp-bal12{
position:static;
}
.disp-txt12{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp13{
width:294px;
height:400px;
position:absolute;
top:2710px;
left:50%;
margin-left:-676px;
z-index:10;
}

.disp-bal13{
position:static;
}
.disp-txt13{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp14{
width:294px;
height:400px;
position:absolute;
top:3171px;
left:50%;
margin-left:-420px;
z-index:10;
}

.disp-bal14{
position:static;
}
.disp-txt14{
width: 294px;
height: auto;
padding:0;
display:block;
}

.disp15{
width:400px;
height:500px;
position:absolute;
top:3100px;
left:50%;
margin-left:190px;
z-index:10;
}

.disp-bal15{
position:static;
}
.disp-txt15{
width: 400px;
height: auto;
padding:0;
display:block;
}


#line-solid {
  stroke: #00c0e7;   /* 線の色 */
  stroke-width: 4px; /* 線の太さ */
  fill: none;        /* 塗りを無効化 */
}



/*------------------------------------------------------------
PAGE DOWNLOADS
------------------------------------------------------------*/
#page-dl{
width:1000px;
margin:0 auto;
padding:160px 0 150px;
}
#page-dl h2{
font-size:72px;
line-height:1;
margin-bottom:50px;
}
#page-dl h2 span{
margin-left:1em;
font-size:32px;
font-weight:normal;
display:inline-block;
}

.dl-desc{
font-size:21px;
line-height:25px;
margin:0 0 98px;
}

.dl-desc2{
font-size:21px;
line-height:25px;
margin:0 0 40px;
}

.dl-ttl{
font-size:24px;
line-height:40px;
}



/*------------------------------------------------------------
PAGE Q&A
------------------------------------------------------------*/

#page-qa{
width:1000px;
margin:0 auto;
padding:160px 0 90px;
}
#page-qa h2{
font-size:72px;
line-height:1;
margin-bottom:50px;
}

.qa dt{
border:1px solid #b3b3b3;
font-size:32px;
line-height:56px;
padding:22px 64px;
position:relative;
margin-bottom:15px;
}
.qa dt::before{
content:'';
width:8px;
height:27px;
background:#b3b3b3;
position:absolute;
top:36px;
left:15px;
}
.qa dt::after{
content:'';
width:29px;
height:29px;
background:url(img/icon-plus.svg) no-repeat;
background-size:29px;
position:absolute;
top:35px;
right:15px;
}
.qa dt.open::after{
content:'';
width:29px;
height:5px;
background:url(img/icon-minus.svg) no-repeat;
background-size:29px;
position:absolute;
top:47px;
right:15px;
}

.qa dd{
display:none;
font-size:18px;
line-height:36px;
margin-bottom:60px;
}

/*------------------------------------------------------------
CATEGORY ARCHIVE
------------------------------------------------------------*/
#cat{
width:1000px;
margin:0 auto;
padding:160px 0 145px;
}

#cat h2{
font-size:72px;
line-height:1;
margin-bottom:50px;
}
#cat h2 span{
margin-left:1em;
font-size:32px;
font-weight:normal;
display:inline-block;
}

/*------------------------------------------------------------
POST SINGLE
------------------------------------------------------------*/
#single{
width:1000px;
margin:0 auto;
padding:160px 0 145px;
}

#single h2{
font-size:72px;
line-height:1;
margin-bottom:50px;
}
#single h2 span{
margin-left:1em;
font-size:32px;
font-weight:normal;
display:inline-block;
}

.post-ttl-area{
border-top:1px solid #b2b2b2;
padding:20px 15px 20px;
border-bottom:5px solid #b2b2b2;
margin-bottom:75px;
}

.post-date{
width:100px;
}

.post-ttl{
font-size:36px;
line-height:48px;
}
.post-content{
font-size:18px;
line-height:1.75;
margin-bottom:150px;
}
.post-content p{
margin-bottom:1.5em;
}
.post-content img{
margin:1em 0;
}

.md-scroll{
display:none;
}

/*------------------------------------------------------------
FOOTER
------------------------------------------------------------*/
.footer-inner{
padding:64px 75px 52px;
width:1400px;
margin:0 auto;
display:flex;
justify-content:space-between;
align-items:center;
}

/*------------------------------------------------------------
END FULL PC LAYOUT CSS
------------------------------------------------------------*/
}
