@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;
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;
}

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

/* ************************************************************
absolute-box
************************************************************ */
.absolute-box{
margin:13% auto;
width:100%;
position:relative;
}

.absolute-box .absolute2{
position:absolute;
top:50%;
left:45%;
}


/* *********** MaxWidth1500(pc)*********** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

.absolute-box .absolute2{
position:absolute;
top:50%;
left:60%;
}

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


/* *********** MaxWidth1300(pc)*********** */
@media screen and (max-width: 1300px) {
 /* ---------------------------------- */

.absolute-box .absolute1{max-width:600px;}

.absolute-box .absolute2{
max-width:400px;
left:55%;
}

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

/* *********** MaxWidth1200(pc)*********** */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */
.absolute-box .absolute1{max-width:550px;}

.absolute-box .absolute2{
max-width:400px;
left:60%;
}

 /* ---------------------------------- */
}
/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
.absolute-box{margin:15% auto;}
.absolute-box .absolute1{max-width:700px;}

.absolute-box .absolute2{
position:static;
margin:0 0 0 auto;
padding-top:5%;
text-align: right;
max-width:570px;
}
 /* ---------------------------------- */
}

/* ***********MaxWidth768(tablet)*********** */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
.absolute-box{margin:20% auto;}

.absolute-box .absolute1{max-width:600px;}
.absolute-box .absolute2{max-width:450px;}

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

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

.absolute-box .absolute1{max-width:480px;}
.absolute-box .absolute2{max-width:400px;}


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

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

.absolute-box .absolute1{max-width:350px;}
.absolute-box .absolute2{max-width:300px;}

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

.absolute-box .absolute1{max-width:300px;}
.absolute-box .absolute2{max-width:250px;}

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

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

#block02 ul{
margin:15% auto;
width:100%;
max-width: 700px;
}

#block02 ul li{
margin:15% auto;
width:100%;
}

#block02 ul li .number{
margin:0 auto 0;
width:100%;
max-width:80px;
}

#block02 ul li .title{
margin:8% auto 0;
width:100%;
font-size:28px;
line-height:1.5;
text-align: center;
letter-spacing: 0.08em;
}

#block02 ul li .text{
margin:6% auto 0;
width:100%;
font-size:16px;
line-height:2;
text-align: left;
letter-spacing: 0.05em;
}


/* *********** MaxWidth1500(pc)*********** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

#block02{margin:25% auto;}

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

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


 /* ---------------------------------- */
}
/* ***********MaxWidth1024(tablet)*********** */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#block02{margin:0% auto;}

#block02 ul{
padding:2% 5%;
margin:0 auto;
}

#block02 ul li{margin:20% auto;}

#block02 ul li .number{
margin:0 auto 0;
width:100%;
max-width:65px;
}

#block02 ul li .title{font-size:22px;}

#block02 ul li .text{
margin:3% auto 0;
font-size:15px;
}

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

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

#block02 ul{
padding:2% 10%;
}

#block02 ul li .title{
margin:6% auto 0;
font-size:24px;
line-height:2
}

#block02 ul li .text{
margin:3% auto 0;
font-size:15px;
}


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

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

#block02 ul li .title{
margin:8% auto 0;
font-size:22px;
line-height:1.6
}

#block02 ul li .text{
margin:5% auto 0;
font-size:14px;
}

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

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

#block02 ul li .title{
margin:8% auto 0;
font-size:20px;
line-height:1.6
}

#block02 ul li .number{
max-width:55px;
}


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


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



/* ************************************************************
block03
************************************************************ */
#block03{
margin:0% auto;
width:100%;
}
#block03 .ex{
margin:0% auto -40px;
width:100%;
max-width:1180px;
padding:2px 2% 2px 20px;
border-left:5px solid #000;
font-size:16px;
letter-spacing: 0.05em;
line-height:1.7;
}



/* *********** MaxWidth1500(pc)*********** */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */

#block03 .ex{
margin:10% auto -40px;
}

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

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

#block03 .ex{
margin:10% auto -20px;
width:82%;
}

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


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

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

#block03 .ex{
border:none;
text-align: center;
padding:0 0 5%;
}

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

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



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

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




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


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