@charset "UTF-8";

/* keyVisual ------------------*/
#keyVisual .mainImg{
background-image:url(../../w2img/20171006165354main_img.jpg);
}

/* blc01 ------------------*/
#blc01{
overflow:hidden;
}

#blc01 .boxBlc{
border-bottom:1px dotted #9585cd;
padding-top:4%;
padding-bottom:4%;
position:relative;
}

#blc01 .boxBlc:last-of-type{
border-bottom:none;
}

/* blc01 blc01 ------------------*/
#blc01 .blc01 .boxBlc:nth-of-type(1){
background:url(../img/guide/deco02.png) no-repeat right top;
background-size:46% auto;
}

#blc01 .blc01 .boxBlc:nth-of-type(2):after{
content:"";
background:url(../img/guide/deco04.png) no-repeat center center;
background-size:100% auto;
padding:15% 12%;
position:absolute;
bottom:-20%;
right:-13%;
}

#blc01 .blc01 .boxBlc .txtCatch{
font-size:160%;
text-align:center;
line-height:1.8;
}

#blc01 .blc01 .boxBlc .imgBlc01{
text-align:center;
padding:4% 0;
}

#blc01 .blc01 .boxBlc .imgBlc02{
text-align:center;
position:relative;
z-index:4;
}

#blc01 .blc01 .boxBlc .list{
padding:0 10%;
}

#blc01 .blc01 .boxBlc .list li{
width:50%;
text-align:center;
padding:0 5%;
float:left;
box-sizing:border-box;
}

#blc01 .blc01 .boxBlc .list li .hexagonStyle01{
text-align:left;
margin-left:auto;
margin-right:auto;
}

#blc01 .blc01 .boxBlc .list li .txt{
margin-top:4%;
}

#blc01 .blc01 .boxBlc .list li .imgBlc{
margin-top:4%;
}

#blc01 .blc01 .boxBlc .list li .imgBlc .vAlign{
display:inline-block;
height:100%;
vertical-align:middle;
}

#blc01 .blc01 .boxBlc .list li .arrowDown{
text-align:center;
margin-top:4%;
}

#blc01 .blc01 .boxBlc .txtCatchBlc{
padding:0 7%;
}

#blc01 .blc01 .boxBlc .txtCatchBlc .inner{
border:2px solid #8dc556;
padding:2% 10% 2% 100px;
margin-top:7%;
position:relative;
box-sizing:border-box;
}

#blc01 .blc01 .boxBlc .txtCatchBlc .inner:after{
content:"";
background:url(../img/guide/deco08.png) no-repeat center center;
background-size:100% auto;
padding:7%;
position:absolute;
bottom:-5%;
right:-5%;
}

#blc01 .blc01 .boxBlc .txtCatchBlc .inner .bubbleBox{
background:url(../img/guide/deco07.png) no-repeat center center;
background-size:100% auto;
color:#fff;
width:142px;
height:121px;
line-height:1.5;
text-align:center;
padding-top:32px;
position:absolute;
bottom:calc(100% - 25%);
right:calc(100% - 12%);
box-sizing:border-box;
}

/* blc01 blc02 ------------------*/
#blc01 .blc02 .boxBlc .partBlc .leftBlc{
width:15%;
float:left;
}

#blc01 .blc02 .boxBlc .partBlc .leftBlc .imgBlc{
text-align:center;
}

#blc01 .blc02 .boxBlc .partBlc .rightBlc{
width:80%;
float:right;
}

#blc01 .blc02 .boxBlc .partBlc .rightBlc .txtCatch{
font-size:140%;
}

#blc01 .blc02 .boxBlc .partBlc .rightBlc .txtBlc{
margin-top:2%;
}

/* blc01 blc03 ------------------*/
#blc01 .blc03 .boxBlc .tbl td{
font-size:140%;
padding:7px 15px;
box-sizing:border-box;
}

#blc01 .blc03 .txtLabel{
background-color:#e6e1fc;
font-size:90%;
color:#9585cd;
border-radius:10px;
padding:4px 10px;
margin-right:10px;
display:inline-block;
}

#blc01 .blc03 .txtLabel.txt02{
background-color:#cac6f7;
color:#fff;
}

#blc01 .blc03 .btn{
text-align:center;
margin-top:2%;
}

#blc01 .blc03 .btn a{
width:100%;
background-color:#9585cd;
color:#fff;
text-align:center;
text-decoration:none;
padding:10px 15px;
display:inline-block;
box-sizing:border-box;
}

@media screen and (max-width: 767px) {
/* blc01 blc01 ------------------*/
#blc01 .blc01 .boxBlc:nth-of-type(2):after{
bottom:2%;
right:-2%;
}

#blc01 .blc01 .boxBlc .txtCatch{
font-size:140%;
}

#blc01 .blc01 .boxBlc .imgBlc02 img{
width:140px;
}

#blc01 .blc01 .boxBlc .list{
padding:0;
}

#blc01 .blc01 .boxBlc .list li .arrowDown img{
width:30px;
}

#blc01 .blc01 .boxBlc .txtCatchBlc .inner:after{
padding:10%;
}

#blc01 .blc01 .boxBlc .txtCatchBlc .inner .bubbleBox{
width:120px;
height:102px;
padding-top:27px;
margin:auto;
top:-5%;
bottom:auto;
right:auto;
left:-40px;
}

/* blc01 blc02 ------------------*/
#blc01 .blc02 .boxBlc .partBlc .rightBlc .txtCatch{
font-size:130%;
}

/* blc01 blc03 ------------------*/
#blc01 .blc03 .boxBlc .tbl td{
font-size:130%;
display:block;
}
}

@media screen and (max-width: 480px) {
}