@charset "UTF-8";
/* CSS Document */

/* ************************************************************
block01
************************************************************ */
#block01{
margin:10% auto;
width:100%;
position:relative;
}

#block01 .box{
margin:0 auto;
width:100%;
max-width:1400px;
display:flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
}

#block01 .box .pic{
margin:0;
width:50%;
}

#block01 .box .catch{
margin:0 auto;
-webkit-writing-mode: vertical-rl;
-moz-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
-ms-writing-mode: vertical-rl;
writing-mode: vertical-rl;
align-items: center;
font-size:30px;
letter-spacing: 0.2em;
line-height:1.8;
}


#block01 .text{
margin:8% auto;
width:100%;
max-width:1000px;
padding:0 5%;
font-size:18px;
line-height:2.5;
letter-spacing: 0.07em;
}



/* *********** MaxWidth1400(pc)*********** */
@media screen and (max-width: 1400px) {
 /* ---------------------------------- */


#block01 .text{
padding:0 5%;
font-size:16px;
}


 /* ---------------------------------- */
}

/* *********** MaxWidth1200(pc)*********** */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */

#block01 .box .catch{
font-size:26px;
}

#block01 .text{
padding:0 10%;
font-size:15px;
}


 /* ---------------------------------- */
}
/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */


 /* ---------------------------------- */
}

/* ***********MaxWidth768(tablet)*********** */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */


#block01 .box{
display:block;
margin:2% auto 0;
}

#block01 .box .pic{
margin:0 auto;
width:100%;
}

#block01 .box .catch{
margin:15% auto 0;
font-size:25px;
}


#block01 .text{
padding:2% 15%;
font-size:14px;
}

 /* ---------------------------------- */
}

/* ***********MaxWidth600(mobile)*********** */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */

#block01 .box{padding:3% 0}

 /* ---------------------------------- */
}

/* ***********MaxWidth480(mobile)*********** */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block01 .box .catch{
margin:15% auto 0;
font-size:21px;
}

#block01 .text{
padding:2% 12%;
font-size:13px;
}

 /* ---------------------------------- */
}

/* ************************************************************
block02
************************************************************ */
#block02{
margin:12% auto;
width:100%;
position:relative;
}

#block02 .voice{
margin:8% auto;
width:100%;
max-width:800px;
}

#block02 .voice .comment{
margin:12% auto 0;
width:100%;
font-size:16px;
text-align: left;
line-height:2;
letter-spacing: 0.1em;
}

#block02 .voice .name{
margin:2% auto;
font-size:16px;
line-height:1.8;
text-align: right;
letter-spacing: 0.1em;
}

#block02 .voice .name span{
border-bottom:1px solid #000;
padding:5px;
}

/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

#block02 .voice{
margin:8% auto;
padding:0 10%;
}

#block02 .voice .comment{
margin:15% auto 0;
width:100%;
font-size:16px;
text-align: left;
line-height:2;
letter-spacing: 0.1em;
}

#block02 .voice .name{
margin:2% auto;
font-size:16px;
line-height:1.8;
text-align: right;
letter-spacing: 0.1em;
}

#block02 .voice .name span{
border-bottom:1px solid #000;
padding:5px;
}

/*common上書き*/
#block02 .rl-box2 h2.short:before{

 background:#fff;

 }
 /* ---------------------------------- */
}

/* ***********MaxWidth768(tablet)*********** */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block02{
margin:20% auto;
}

#block02 .voice{
margin:12% auto;
padding:0 10%;
}

#block02 .voice .comment{
margin:20% auto 0;
font-size:14px;
}

#block02 .voice .name{
margin:4% auto;
font-size:14px;
}

 /* ---------------------------------- */
}

/* ***********MaxWidth600(mobile)*********** */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */



 /* ---------------------------------- */
}

/* ***********MaxWidth480(mobile)*********** */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */



#block02 .voice .comment{
font-size:13px;
}

#block02 .voice .name{
font-size:13px;
}

 /* ---------------------------------- */
}
/* ***********MaxWidth380(mobile)*********** */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */


 /* ---------------------------------- */
}

/* ************************************************************
block03
************************************************************ */
#block03{
margin:15% auto;
width:100%;
}

#block03 article{
margin:10% auto;
width:100%;
max-width:800px;
}

#block03 article dt{
margin:8% auto 0;
width:100%;
font-size:22px;
letter-spacing: 0.05em;
line-height:1.7;
}

#block03 article dd{
margin:1% auto 0;
width:100%;
font-size:16px;
letter-spacing: 0.05em;
line-height:1.7;
padding:0 2%;
}
#block03 article dd span{
font-weight:bold;
}


/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#block03 article{padding:0 5%;}

#block03 article dt{font-size:20px;}
#block03 article dd{font-size:14px;}

 /* ---------------------------------- */
}


/* ***********MaxWidth768(tablet)*********** */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block03 article{
margin:15% auto;
padding:0 10%;
}

#block03 article dt{
margin:8% auto 0;
font-size:18px;
}

#block03 article dd{font-size:14px;}

 /* ---------------------------------- */
}

/* ***********MaxWidth480(mobile)*********** */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block03 article dt{
margin:12% auto 0;
font-size:16px;
}

#block03 article dd{font-size:13px;}

 /* ---------------------------------- */
}
/* ***********MaxWidth380(mobile)*********** */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */
 
#block03 article dd{text-align: justify}

 /* ---------------------------------- */
}

/* ************************************************************
block04
************************************************************ */
#block04{
margin:15% auto;
width:100%;
max-width:800px;
}

#block04 h3{
margin:12% auto 0;
width:100%;
text-align: center;
font-size:25px;
letter-spacing: 0.2em;
line-height:1.8;
position:relative;
}

#block04 h3:after{
content: " ";
border-bottom:1px solid #000;
width:50px;
position:absolute;
bottom:-5px;
left:50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}

#block04 .border-list{
margin:10% auto 0;
width:100%;
}

#block04 .border-list li{
margin:0 auto 0;
width:100%;
display:flex;
justify-content: space-between;
align-items: center;
border-bottom:1px solid #000;
padding:3% 2%;
letter-spacing: 0.05em;
font-size:16px;
line-height:1.6;
}

#block04 .border-list li .p01{
margin:0 auto 0;
width:30%;
text-align: left;
}

#block04 .border-list li .p02{
margin:0 auto 0;
width:70%;
text-align: left;
}
#block04 .border-list li .p02 span{
padding:1%;
font-weight:bold;
font-size:14px;
display:block;
}

/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */

#block04{padding:5% 10%}

#block04 .border-list li{
font-size:14px;
}

#block04 .border-list li .p02 span{
font-size:12px;
}

 /* ---------------------------------- */
}

/* ***********MaxWidth768(tablet)*********** */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */

#block04 .border-list li{
display:block;
padding:5% 3%;
}

#block04 .border-list li .p01{
margin:0 auto 0;
width:100%;
text-align: left;
font-weight:bold;
}

#block04 .border-list li .p02{
margin:1% auto 0;
width:100%;
text-align: left;
}

 /* ---------------------------------- */
}

/* ***********MaxWidth600(mobile)*********** */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */



 /* ---------------------------------- */
}

/* ***********MaxWidth480(mobile)*********** */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */

#block04 h3{font-size:20px;}

 /* ---------------------------------- */
}
/* ***********MaxWidth380(mobile)*********** */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */


 /* ---------------------------------- */
}