﻿

@media screen and (min-width: 769px){
 .pagetitle-container {
  background: url("../img/gradientbg_pc.jpg") top center #000 no-repeat;
  background-size: cover;
 }
}
@media screen and (max-width: 768px){
 .pagetitle-container {
  background: url("../img/gradientbg_sp.jpg")top center #000 no-repeat;
  background-size: cover;
 }
}


.policy-container {
 width: 90%;
 max-width: 1360px;
 text-align: left;
}


.policy-header { border-bottom: solid 1px #000; }
 .policy-headline ,.policy-body .-headline {font-weight: 500; line-height: 1.4; }
 .policy-date { text-align: right; }
 .policy-body a:not([class]) { text-decoration: underline; }


@media screen and (min-width: 769px){
 .policy-container { margin: 70px auto 140px; }
 .policy-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 1.5em; }
 .policy-headline {font-size: clamp(24px,32px,3vw); }
 .policy-date { width: 8em; padding-left: 2em; }
 .policy-body { margin-top: 60px; }
    
 .policy-body > * + div , .policy-body > * + p:not(.-note) { margin-top: 45px; }
 .policy-body .-headline.-v2 + * ,  .policy-body .-headline.-v3 + * { margin-top: 25px; }
    
 .policy-body .-clm2 , .policy-body .-clm3 { display: flex; justify-content: flex-start; flex-wrap: wrap; }
 .policy-body .-clm2 > * { width: 48.5%; }
 .policy-body .-clm2 > *:not(:nth-child(2n)) { margin-right: 3%; }
 .policy-body .-clm2 > *:nth-child(n+3) { margin-top: 36px; }
 .policy-body .-clm3 > * { width: 31.3%; }
 .policy-body .-clm3 > *:not(:nth-child(3n)) { margin-right: 2.66%; }
 .policy-body .-clm3 > *:nth-child(n+4) { margin-top: 28px; }
    
 .policy-body .-headline.-v2 { margin-top: 2em; font-size: clamp(18px,24px,3vw); }    
 .policy-body .-headline.-v3 { margin-top: 2em; font-size: clamp(16px,18px,1.5vw); } 
}
@media screen and (max-width: 768px){
 .policy-container { margin: 35px auto 70px; }
 .policy-header { padding-bottom: 1em; }
 .policy-headline {font-size: clamp(14px,18px,6vw); }
 .policy-date { margin-top: .5em; }
 .policy-body { margin-top: 30px; }    
    
 .policy-body > * + div , .policy-body > * + p:not(.-note) { margin-top: 45px; }
 .policy-body .-headline.-v2 + * ,  .policy-body .-headline.-v3 + * { margin-top: 25px; }    

 .policy-body .-clm2 > * + * , .policy-body .-clm2 > * + *  { margin-top: 2em; }
 
 .policy-body .-headline.-v2 { margin-top: 2em; font-size: clamp(14px,18px,6vw); }    
 .policy-body .-headline.-v3 { margin-top: 2em; font-size: clamp(12px,14px,4vw); } 
}
.policy-box.-inner {
 width: 100%;
 border: solid 1px #cacaca;
 font-weight: 500;
 text-align: center;
}

@media screen and (min-width: 769px){
.policy-box.-inner { padding: 1.5em 1.25em; }
}
@media screen and (max-width: 768px){
.policy-box.-inner { padding: 1.5em .5em; }
}


/* list */
ul.-note > li { position: relative; padding-left:1.5em; }

ul.-square {
 counter-reset: item;
 text-align: left;
 line-height: 1.6;
}

ul.-square> li  { position: relative;margin-top: .5em; padding-left:1.5em; }
ul.-square > li:before { position: absolute; top:.5em; left:0; content: "■"; transform:translateY(-8px); }


@media screen and (min-width: 769px){
ul.-dot.-flex {
  display: flex;
  gap: 18px;
}
}
@media screen and (max-width: 768px){
ul.-dot.-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 0 18px;
}
ul.-dot.-flex > li {
  width: calc(50% - 9px);
}
}
