@charset "UTF-8";

/*------------------------------------------------------------
	data
------------------------------------------------------------*/

/* 共通パーツ調整 */
.title_bg02 {
    margin-bottom: 40px;
}
.data_main .links_txt01 {
	padding: 60px 0 100px;
}

@media only screen and (max-width: 820px) {
    .title_bg02 {
        margin-bottom: 2.666667vw;
    }
    .data_main .links_txt01 {
        padding: 21.333333vw 0;
    }
    
    .page_title {
        display: block;
        padding: 28.533333vw 5.333333vw 10.333333vw;
        background-size: 100% auto;
        background-position: center bottom;
    }
    .page_title_img {
        margin-bottom: 25.333333vw;
    }
}

/* .data_main */
.data_main{
    background-image: 
        url(../images/bg_wave_top.png),
        linear-gradient(-90deg,rgba(227, 240, 255, 1) 0%, rgba(206, 244, 229, 1) 100%);
    background-size: 
        100% auto,100% auto;
    background-repeat: 
        no-repeat,
        repeat-x;
    background-position: 
        center top,center center;
    padding-top: 100px;
}

@media only screen and (max-width: 820px) {
    .data_main{
        padding-top: 23.2vw;
        padding-bottom: 2.666667vw;
    }
}

/* .data_main_section01 */
.data_main_section01 ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.data_main_section01 ul li{
    width:452px;
    height: 452px;
    margin: 0 30px 40px;
    background-image: url("../images/data/data_sec01_bg.png");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
    text-align: center;
    color: #0C64A0;
    font-weight: bold;
    padding-top: 15px;
}
.data_main_section01 ul li:nth-child(1){
    padding-top: 32px;
}
.data_main_section01 ul li:nth-child(1) img{
    width: 367px;
    height: auto;    
}
.data_main_section01 ul li:nth-child(2) img{
    width: 339px;
    height: auto;    
}
.data_main_section01 ul li:nth-child(3) img{
    width: 389px;
    height: auto;    
}
.data_main_section01 ul li:nth-child(4) img{
    width: 418px;
    height: auto;    
}

@media only screen and (max-width: 820px) {
    .data_main_section01 ul{
        
    }
    .data_main_section01 ul li{
        width:42.666667vw;
        height: 42.666667vw;
        margin-right: 4vw;
        margin-left: 0;
        margin-bottom: 2.666667vw;
        padding-top: 1.333333vw;
    }
    .data_main_section01 ul li:nth-child(2n){
        margin-right: 0;
    }
    .data_main_section01 ul li:nth-child(1){
        padding-top: 2.666667vw;
    }
    .data_main_section01 ul li:nth-child(1) img{
        width: 33.066667vw;
        height: auto;    
    }
    .data_main_section01 ul li:nth-child(2) img{
        width: 31.733333vw;
        height: auto;    
    }
    .data_main_section01 ul li:nth-child(3) img{
        width: 36.533333vw;
        height: auto;    
    }
    .data_main_section01 ul li:nth-child(4) img{
        width: 38.4vw;
        height: auto;    
    }
}

/* .data_main_contents */
.data_main_contents{
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
}
.data_main_contents_box{
    background-color: #fff;
    width:calc(50% - 15px);
    margin-bottom: 40px;
    border-radius: 20px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    overflow: hidden;
}
.data_main_contents_box_title{
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    background-color: #0C64A0;
    color: #fff;
    padding: 15px;
    border-radius: 20px 20px 0 0;
}
.data_main_contents_box_main{
    position: relative;
    text-align: center;
    padding: 0 20px;
}
.data_main_contents_box_main img{
    width:calc(100% - 20px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}
.data_main_section02 .data_main_contents_box_main{
    height: 490px;
}
.data_main_section03 .data_main_contents_box_main{
    height: 383px;
}
.data_main_section03 .data_main_contents_box_main img{
    height: 313px;
    width: auto;
}

.data_main_section02 .data_main_contents .data_main_contents_box:first-child{
    background-image: url("../images/data/data_sec02_img01_bg.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: bottom center;
}

@media only screen and (max-width: 820px) {
    .data_main_contents{
        display: block;
    }
    .data_main_contents_box{
        width:100%;
        margin-bottom: 2.666667vw;
        border-radius: 5.333333vw;
    }
    .data_main_contents_box_title{
        font-size: 4.533333vw;
        padding: 2.133333vw;
        border-radius: 5.333333vw 5.333333vw 0 0;
    }
    .data_main_contents_box_main{
        padding: 2.666667vw;
    }
    .data_main_contents_box_main img{
        
    }
    .data_main_section02 .data_main_contents_box:nth-child(1) .data_main_contents_box_main{
        height: 42.933333vw;
    }
    .data_main_section02 .data_main_contents_box:nth-child(2) .data_main_contents_box_main{
        height: 74.933333vw;
    }
    .data_main_section02 .data_main_contents_box:nth-child(3) .data_main_contents_box_main{
        height: 54.4vw;
    }
    .data_main_section02 .data_main_contents_box:nth-child(3) .data_main_contents_box_main img{
        height: 46.4vw;
        width: auto;
    }
    .data_main_section02 .data_main_contents_box:nth-child(4) .data_main_contents_box_main{
        height: 64.266667vw;
    }
    .data_main_section03 .data_main_contents_box_main{
        height: 53.333333vw;
    }
    .data_main_section03 .data_main_contents_box_main img{
        height: 48vw;
    }

    .data_main_section02 .data_main_contents .data_main_contents_box:first-child{
        background-image: url("../images/data/data_sec02_img01_bg.png");
        background-repeat: no-repeat;
        background-size: 100% auto;
        background-position: bottom center;
    }
}

/* links */
.links{
    background-image: url(../images/data/bg_wave_bottom.png);
    background-size:100% auto;
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 100px;
    padding-bottom: 100px;
}

@media only screen and (max-width: 820px) {
    .links .inner{
        padding-left:0;
        padding-right: 0;
    }
}