@charset "UTF-8";

/*index*/
#technology_top{padding-bottom: 80px;}
.technology_box{margin-bottom: 40px;}
.technology_box p{font-size: 20px;letter-spacing: 2px; padding: 0 15px;}
.technology_box p b{font-family: 'Dosis'; font-size: 30px; padding-right: 10px;}

/*page*/
.page_title{font-size: 26px;}
.t_content{font-size: 22px; line-height: 1.7;}
.contents_list{padding: 0 0 60px;}
.contents_list ul{border-top: 1px solid #adc9ca;}
.contents_list ul li a{display: block; border-bottom: 1px solid #adc9ca; font-size: 16px; padding: 10px 0 10px 20px; position: relative;}
.contents_list ul li a::before{content: ""; display: inline-block; width: 5px; height: 5px; position: absolute; left: 0; top: 22px;
    border-top: 2px solid #27b1b1; border-right: 2px solid #27b1b1; transform: rotate(45deg);}
body.technology figure.figure_image{margin: 40px 0; text-align: center; /*background: #fff; padding: 10px;*/}
body.technology figure.figure_image figcaption{font-size: 11px; text-align: center;}
body.technology figure.figure_image p{font-size: 11px; text-align: center;}

.technology_list{padding: 60px 0;}
.technology_list a{display: block; background: #27b1b1; color: #fff; padding: 20px 0;}
.technology_list .technology_top{text-align: center; padding: 0 20px 20px;}
.technology_list ul{display: flex; justify-content: center;}
.technology_list ul li{width: 20%; text-align: center; padding: 0 15px;}

.technology_wrap{max-width: 900px; margin: 0 auto;}
.technology_wrap .t_content{margin-bottom: 30px;}
.technology_wrap .left_area{float: none; width: 100%;}
.technology_wrap .right_area{float: none; width: 100%;}

.img_techRight{float: right; max-width: 350px;}
.img_techRight.w500{max-width: 500px;}
.img_techRight figcaption,
.img_techRight p{text-align: left; line-height: 1.5; font-size: 11px;}
body.technology figure.figure_image.img_techRight{margin: 7px 0 40px 20px;}

.mb_20{margin-bottom: 20px;}
.mb_30{margin-bottom: 30px;}


.chart_box{/*background: #fff; padding: 20px;*/ margin: 40px 0; text-align: center;}
.chart_box.w_65{max-width: 65%; margin: 40px auto;}
.chart_box table{width: 100%; vertical-align: middle; border-top: 1px solid #111; border-left: 1px solid #111; margin: 0 0 10px; text-align: center; letter-spacing: 0; font-size: 14px;}
.chart_box table tr{}
.chart_box table th{vertical-align: middle; border-bottom: 1px solid #111; border-right: 1px solid #111; padding: 10px; width: 20%; background: #ececec;}
.chart_box table th.double,
.chart_box table td.double{border-right: 4px double #111;}
.chart_box table th.bt_dott,
.chart_box table td.bt_dott{border-bottom: 1px dotted #111;}
.chart_box table th.br_dott,
.chart_box table td.br_dott{border-right: 1px dotted #111;}
.chart_box.w_auto table th{width: auto;}
.chart_box table td{background: #fff; vertical-align: middle; border-bottom: 1px solid #111; border-right: 1px solid #111; padding: 10px;}
.chart_box table td.dotted{border-bottom: 1px dotted #111;}
.chart_box .big_text{font-size: 18px; font-weight: bold; margin-bottom: 15px;}
.chart_box .caption{text-align: left; font-size: 11px;}
.chart_box.th_green tr th{background: #bbe0d3;}

@media screen and (max-width:480px){
    .img_techRight{float: none; max-width: 100%;}
    body.technology figure.figure_image.img_techRight{margin: 30px 0;}
    .chart_box.w_65{max-width: 100%;}
}

/*page1*/
#technology_page1_1{background: #fafbfb; padding: 120px 0;}
#technology_page1_2{background: #e5f5f5; padding: 120px 0;}
#technology_page1_3{background: #fafbfb; padding: 120px 0;}

/*page2*/
#technology_page2_1{background: #fafbfb; padding: 120px 0;}
#technology_page2_2{background: #e5f5f5; padding: 120px 0;}
#technology_page2_3{background: #fafbfb; padding: 120px 0;}
#technology_page2_4{background: #e5f5f5; padding: 120px 0;}

#technology_page2_2 ul{padding-left: 20px;}
#technology_page2_2 ul li{list-style: disc;}

/*page3*/
#technology_page3_1{background: #fafbfb; padding: 120px 0;}
#technology_page3_2{background: #e5f5f5; padding: 120px 0;}
#technology_page3_3{background: #fafbfb; padding: 120px 0;}

/*page4*/
.t-page_4 .page_title{letter-spacing: 3px;}
#technology_page4_1{background: #fafbfb; padding: 120px 0;}
#technology_page4_2{background: #e5f5f5; padding: 120px 0;}
#technology_page4_3{background: #fafbfb; padding: 120px 0;}
#technology_page4_4{background: #e5f5f5; padding: 120px 0;}
#technology_page4_5{background: #fafbfb; padding: 120px 0;}
#technology_page4_5 ul{padding-left: 20px;}
#technology_page4_5 ul li{list-style: disc;}

.see_through_image{position: relative;}
.see_through_image .image_a{position: relative;}
.see_through_image .image_b{position: absolute; top: 0; left: 0; opacity: 0; transition: 0.3s ease-out;}
.see_through_image:hover .image_b{opacity: 1;}

.see_through_data dt{font-size: 20px;}
.see_through_data dd{margin-bottom:20px;}
.see_through_data dd span{color: #2f77de;}

/*page5*/
#technology_page5_1{background: #fafbfb; padding: 120px 0;}
#technology_page5_2{background: #e5f5f5; padding: 120px 0;}
#technology_page5_3{background: #fafbfb; padding: 120px 0;}

@media screen and (max-width:480px){
    body.technology figure.figure_image{margin: 20px 0;}
    .technology_list{padding: 30px 0 10px;}
    .technology_list ul{display: block;}
    .technology_list ul li{width: 100%; margin-bottom: 20px;}

    #technology_page1_1,
    #technology_page1_2,
    #technology_page1_3{padding: 60px 0;}

    #technology_page2_1,
    #technology_page2_2,
    #technology_page2_3,
    #technology_page2_4{padding: 60px 0;}

    #technology_page3_1,
    #technology_page3_2,
    #technology_page3_3{padding: 60px 0;}

    .chart_box{overflow: scroll;}
    .chart_box table{width: 500px; margin: 10px 0;}

    #technology_page4_1,
    #technology_page4_2,
    #technology_page4_3,
    #technology_page4_4,
    #technology_page4_5{padding: 60px 0;}


    #technology_page5_1,
    #technology_page5_2,
    #technology_page5_3{padding: 60px 0;}
}