@charset "utf-8";
/* CSS Document */
.edit_area {line-height: 1.5; color: #221815;}
.edit_area h2 {font-size: 222.222%; color: rgba(56, 85, 143, 0.9);}
.edit_area h3 {font-size: 205.556%; color: rgba(56, 85, 143, 0.8);}
.edit_area h4 {font-size: 188.889%; color: rgba(56, 85, 143, 0.7);}
.edit_area h5 {font-size: 172.222%; color: rgba(56, 85, 143, 0.6);}
.edit_area h6 {font-size: 155.556%; color: rgba(56, 85, 143, 0.5);}

.seo-content {line-height: 2; color: #000;}
.seo-content h2 {font-size: 175%; color: rgba(214, 85, 70,1);}
.seo-content h3 {font-size: 162.5%; color: rgba(214, 85, 70,0.9);}
.seo-content h4 {font-size: 150%; color: rgba(214, 85, 70,0.8);}
.seo-content h5 {font-size: 137.5%; color: rgba(214, 85, 70,0.7);}
.seo-content h6 {font-size: 125%; color: rgba(214, 85, 70,0.6);}


#content {padding: 0;}
.bgBlue {background: #d1e6fc;}

.subBn {position: relative; z-index: 1; overflow: hidden; min-height: 130px;}
.subBn picture > img {width: 100%;}
.subBn::after {content: ''; background: url("../images/bg_02.png") no-repeat bottom left; width: 3000px; height: 151px; position: absolute; bottom: 0; left: 0; z-index: 10; pointer-events: none; cursor: text; transition: all 0.25s ease 0s;}
.subBn_P::after {background: url("../images/bg_02b.png") no-repeat bottom left;}

.path {max-width: 1817px; margin: 0 auto; padding: 0 100px; position: relative; z-index: 100;}
.path > ul, .path > ul li {list-style-type:none; margin: 0; padding: 0;}
.path > ul {width: 100%; display: flex; flex-wrap: wrap; padding: 4px 0 20px 3px;}
.path > ul li {color:#000; font-weight: 500; line-height: 1.2857; letter-spacing: 0.4px; position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center;}
.path > ul li::after {content: '/'; margin: 0 4px; color:#000; font-weight: 400;}
.path > ul li:last-child::after {content: none;}
.path > ul li a:link, .path > ul li a:visited {text-decoration:none; color:#000; font-weight: 400; position: relative; transition: all 0.5s ease 0s;}
.path > ul li a:active, .path > ul li a:hover {text-decoration:none; color:#d55446; cursor:pointer; transition: all 0.5s ease 0s;}
.path > ul li a::after {content: ''; width: 14px; height: 9px; border-radius: 14px 14px 0 0; background: #d55446; position: absolute; top: -9px; right: calc(50% - 7px); opacity: 0; transition: all 0.5s ease 0s;}
.path > ul li a:hover::after {opacity: 1;}

.circle_a01 {width: 41.667%; position: absolute; top: -15px; left: -15.365%; z-index: -10; pointer-events: none;}
.circle_a02 {width: 41.667%; position: absolute; top: -41.898%; right: -9.375%; z-index: -10; pointer-events: none;}
.point_a01 {width: 32px; height: 32px; border-radius: 50%; background: #590eb5; position: absolute; top: 11.899%; left: 49.896%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a02 {width: 40px; height: 40px; border-radius: 50%; background: #ffc600; position: absolute; bottom: 19.46%; left: 33.542%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a03 {width: 11px; height: 11px; border-radius: 50%; background: #fd426f; position: absolute; bottom: 11.565%; right: 17.813%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a04 {width: 18px; height: 18px; border-radius: 50%; background: #0eb582; position: absolute; top: 8.422%; left: 9.636%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a05 {width: 23px; height: 23px; border-radius: 50%; background: #d55952; position: absolute; top: 14.001%; right: 20%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a06 {width: 10px; height: 10px; border-radius: 50%; background: #0e39b5; position: absolute; top: 45.476%; left: 46.3021%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.point_a07 {width: 35px; height: 35px; border-radius: 50%; background: #0eb582; position: absolute; bottom: 29.055%; left: 44.063%; z-index: 1; transition: all 2s ease 0s; pointer-events: none;}
.circle_p01 {width: 41.667%; position: absolute; top: -121px; left: -15.365%; z-index: -10; pointer-events: none;}
.circle_p02 {width: 41.667%; position: absolute; bottom: -35px; right: -16.667%; z-index: -10; pointer-events: none;}
.circle_p11 {width: 41.667%; position: absolute; top: -262px; left: -15.365%; z-index: -10; pointer-events: none;}
.circle_p12 {width: 58.594%; position: absolute; top: 0; right: -6.25%; z-index: -10; pointer-events: none;}
.circle_n01 {width: 41.667%; position: absolute; top: -16.129%; left: -15.365%; z-index: -10; pointer-events: none;}
.circle_n02 {width: 41.667%; position: absolute; top: 20.187%; right: -9.375%; z-index: -10; pointer-events: none;}
.circle_c01 {width: 41.667%; position: absolute; top: -15.42%; left: -15.365%; z-index: -10; pointer-events: none;}
.circle_c02 {width: 41.667%; position: absolute; top: 9.373%; right: -9.375%; z-index: -10; pointer-events: none;}

.tit_a {color: #040404; font-weight: 700; line-height: 1.1; letter-spacing: -0.1px; position: relative; z-index: 1; margin: 0 0 3.526% -3px; padding: 5px 0 0 0;}
.tit_a::after {content: ''; background: url("../images/icon_06a.png") no-repeat center / cover; width: 51px; height: 9px; position: absolute; top: calc(100% + 19px); left: 6px;}

.tit_b {color: #040404; font-weight: 700; line-height: 1.1; letter-spacing: -0.1px; position: relative; z-index: 1; margin: 0 0 35px -2px; padding: 5px 0 0 0;}

.pages {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 0 0 0 6px;}
.pages a:link, .pages a:visited {text-decoration:none; color:#000; border: 1px solid rgba(0, 0, 0, 0.6); font-weight: 500; line-height: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; min-width: 51px; height: 45px; border-radius: 45px; overflow: hidden; padding: 1px 10px 0 10px; margin: 0 10px 5px 10px; position: relative; z-index: 10; transition: all 0.5s ease 0s;}
.pages a:active, .pages a:hover {text-decoration:none; color:#fff; background: #d65546; border: 1px solid #d65546; cursor:pointer; transition: all 0.5s ease 0s;}
.pages .prev {background: #fff; color: rgba(0, 0, 0, 0.67); font-size: 120%; border: 1px solid rgba(0, 0, 0, 0.6); min-width: 48px!important; padding: 1px 10px 0 12px!important; margin: 0 10px 5px 10px!important;}
.pages .next {background: #fff; color: rgba(0, 0, 0, 0.67); font-size: 120%; border: 1px solid rgba(0, 0, 0, 0.6); min-width: 48px!important; padding: 1px 12px 0 10px!important; margin: 0 10px 5px 10px!important;}
.pages .prev_pages {background: #fff; color: rgba(0, 0, 0, 0.67); font-size: 120%; letter-spacing: -0.5px!important; border: 1px solid rgba(0, 0, 0, 0.6); min-width: 58px!important; padding: 1px 10px 0 12px!important; margin: 0 10px 5px 0!important;}
.pages .next_pages {background: #fff; color: rgba(0, 0, 0, 0.67); font-size: 120%; letter-spacing: -0.5px!important; border: 1px solid rgba(0, 0, 0, 0.6); min-width: 58px!important; padding: 1px 12px 0 10px!important; margin: 0 0 5px 10px!important;}
.pages .current {color:#fff!important; background: #38558f; border: 1px solid #38558f!important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.14); pointer-events: none; cursor: text;}

.subM {padding: 8px 0 30px 0; margin: 0;}
.subM > div {display: none;}
.subM > ul, .subM > ul li {list-style-type:none; margin: 0; padding: 0; font-weight: 600; line-height: 1.1;}
.subM > ul {width: 100%; display: flex; flex-wrap: wrap; justify-content: center; transition: all 0.75s ease 0s;}
.subM > ul li {padding: 7px 0.681%;}
.subM > ul li a:link, .subM > ul li a:visited {text-decoration:none; color:rgba(0, 0, 0, 0.74); border: 2px solid #d55446; background-color: #fff; min-width: 310px; border-radius: 55px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; text-align: center; position: relative; padding: 14px 20px 15px 20px; transition: all 0.5s ease 0s;}
.subM > ul li a:active, .subM > ul li a:hover {text-decoration:none; color:rgba(255, 255, 255, 0.87); background: #ff4733; cursor:pointer;}
.subM > ul li.current a {pointer-events: none; cursor: text; color:rgba(255, 255, 255, 0.87); background: #ff4733;}
@media only screen and (max-width:768px){
    .subM {padding: 35px 0 32px 0; margin: 0 0px;}
    .subM > div {width: 30px; height: 30px; position: relative; display: block; margin: auto; cursor: pointer;}
    .subM > div > span:nth-child(1) {width: 30px; height: 2px; background-color: #425d91; position: absolute; top: 10px; left: 0; transition: all 0.5s ease 0s;}
    .subM > div.show > span:nth-child(1) {top: 14px; transform: rotate(45deg); background-color: #ff4733;}
    .subM > div > span:nth-child(2) {width: 30px; height: 2px; background-color: #425d91; position: absolute; top: 20px; left: 0; transition: all 0.5s ease 0s;}
    .subM > div.show > span:nth-child(2) {top: 14px; transform: rotate(-45deg); background-color: #ff4733;}
    .subM > div::before {content: attr(data-title); width: 260px; height: 30px; line-height: 30px; position: absolute; top: -30px; left: calc(50% - 130px); text-align: center; font-size: 12px; color: #425d91;}
    .subM ul {max-height: 0; overflow: hidden;}
    .subM ul > li {padding: 5px;}
    .subM ul > li::after {content: none;}
    .subM ul.open {max-height: inherit; padding: 10px 0; transition: all 1.5s ease 0s;}
}


.abou_wrap {position: relative; z-index: 10;}
.abou_A {padding: 5px 0 13.907% 0; position: relative; z-index: 10;}
.abou_A > .frame_1617 {display: flex; flex-flow: wrap; position: relative; z-index: 10;}
.abou_A > .frame_1617 > .txt {width: 44.837%; letter-spacing: -0.29px;}
.abou_A > .frame_1617 > .txt > .tit {color: #040404; font-weight: 700; line-height: 1.1; letter-spacing: -0.1px; position: relative; z-index: 1; margin: 0 0 7.864% 2px;}
.abou_A > .frame_1617 > .txt > .tit::after {content: ''; background: url("../images/icon_06a.png") no-repeat center / cover; width: 51px; height: 9px; position: absolute; top: calc(100% + 19px); left: 1px;}
.abou_A > .frame_1617 > .txt .fs_30 {color: #221815; font-weight: 600; line-height: 1.25; letter-spacing: -0.3px; margin: 0;}
.abou_A > .frame_1617 > .txt p {margin: 0;}
.abou_A > .frame_1617 > .img {width: 55.163%; position: relative; z-index: 1;}
.abou_A > .frame_1617 > .img .pho {position: absolute; top: -17.058%; left: 27px; width: 98.544%;}
.abou_B {background: #e4f3ff; padding: 4.688% 0 4.271% 0; position: relative; z-index: 1;}
.abou_B > .frame_1617 {display: flex; flex-flow: wrap; position: relative; z-index: 10;}
.abou_B > .frame_1617 > .img {width: 51.021%; position: relative; z-index: 1;}
.abou_B > .frame_1617 > .img .pho {position: absolute; top: -6px; right: 7.394%; width: 96.97%;}
.abou_B > .frame_1617 > .txt {width: 48.979%; color: #221815; line-height: 1.5; letter-spacing: -0.29px; padding: 0 4.02% 0 0;}
.abou_B > .frame_1617 > .txt > .en {color: #d55952; font-weight: 600; letter-spacing: -0.1px; display: flex; flex-flow: wrap; align-items: center; margin: 0 0 2px 4px;}
.abou_B > .frame_1617 > .txt > .en::before {content: ''; background: url("../images/icon_06b.png") no-repeat center / cover; width: 51px; height: 9px; display: block; margin: 0 16px 0 0;}
.abou_B > .frame_1617 > .txt > .tit {color: #232323; font-weight: 700; line-height: 1.333333; letter-spacing: 0; position: relative; z-index: 1; margin: 0 0 6.466% 1px;}
.abou_B > .frame_1617 > .txt > .lis {font-weight: 400; letter-spacing: -0.55px; padding: 0 0 0 75px; position: relative; z-index: 1; margin: 0 0 27px 0;}
.abou_B > .frame_1617 > .txt > .lis > .tit {color: #181a25; font-weight: 700; line-height: 1.0833333; letter-spacing: 0; margin: 0 0 14px -1px;}
.abou_B > .frame_1617 > .txt > .lis > .tit > .pho {width: 58px; height: 58px; border-radius: 58px; background: #fff; display: flex; flex-flow: wrap; justify-content: center; align-items: center; position: absolute; top: -13px; left: 3px;}
.abou_B > .frame_1617 > .txt > .lis > .tit > .pho img {max-height: 100%;}
.abou_B > .frame_1617 > .txt > .lis p {margin: 0;}


.prod_wrap {position: relative; z-index: 1; padding: 0 5px 0 0;}
.prod_wrap > .frame_1617 {position: relative; z-index: 10;}
.prod_cla {display: flex; flex-flow: wrap; align-items: flex-start; justify-content: space-between; padding: 19px 0 53px 0; margin: 0 -1px 0 0;}
.prod_cla > div {width: 49.382%; margin: 0 0 19px 0; border-radius: 15px; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.08); position: relative; z-index: 1; background: #fff;}
.prod_cla > div > .img {position: relative; z-index: 1; border-radius: 10px 10px 11px 11px; overflow: hidden; transition: all 0.25s ease 0s;}
.prod_cla > div:hover > .img {margin: 13px 14px 16px 14px;}
.prod_cla > div > .img::before {content: ''; background: url("../images/icon_04g.png") no-repeat center / cover; width: 37px; height: 36px; position: absolute; top: calc(50% + 10px); left: calc(50% - 20px); z-index: 100; opacity: 0; transition: all 0.25s ease 0s;}
.prod_cla > div:hover > .img::before {top: calc(50% - 13px); opacity: 1;}
.prod_cla > div > .img::after {content: ''; background: rgba(30, 78, 174, 0.5); position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 50; opacity: 0; transition: all 0.25s ease 0s;}
.prod_cla > div:hover > .img::after {opacity: 1;}
.prod_cla > div > .img > .pho {height: 0; padding-bottom: 59.95%; position: relative; z-index: 1; transition: all 0.25s ease 0s;}
.prod_cla > div:hover > .img > .pho {padding-bottom: 58.4%;}
.prod_cla > div > .img > .pho img {position: absolute; top: 50%; left: 50%; display: block; width: 100%; height: 100%; object-fit:cover; transform:translate(-50.1%,-50%) scale(1.005, 1.005);}
.prod_cla > div > .txt {position: absolute; bottom: 16px; left: 14px; right: 14px; z-index: 10; background: rgba(255, 255, 255, 0.9); border-radius: 0 30px 10px 10px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.19); padding: 20px 70px 18px 21px;}
.prod_cla > div > .txt::after {content: ''; background: url("../images/icon_04f.png") no-repeat center / cover; width: 37px; height: 38px; position: absolute; top: 17px; right: 18px; z-index: 1;}
.prod_cla > div > .txt > .tit {color: #343434; font-weight: 500; line-height: 1.083333; margin: 0 0 7px -1px; transition: all 0.25s ease 0s;}
.prod_cla > div:hover > .txt > .tit {color: #38558f;}
.prod_cla > div > .txt > .mor {color: #425d91; font-weight: 600; line-height: 1.111111; position: relative; z-index: 1;}
.prod_cla > div > .txt > .mor::after {content: ''; background: #425d91; height: 1px; position: absolute; top: calc(100% + 0px); left: 1px; right: 0;}
.prod_lis {display: flex; flex-flow: wrap; border-top: 1px solid #bfbfbf; max-width: 1608px; padding: 30px 0 59px 0; margin: 0 0 0 5px;}
.left_side {width: 443px; padding: 4px 0 0 5px;}
.prod_lis > .rig {width: 100%;}
.prod_lis > .left_side + .rig {width: calc(100% - 443px);}
.prod_lis_main {display: flex; flex-flow: wrap; padding: 0 0 43px 0;}
.prod_lis_main > div {width: 31.76%; position: relative; z-index: 1; border-radius: 4px; overflow: hidden; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.24); margin: 0 2.36% 32px 0;}
.prod_lis_main > div:nth-child(3n+3), .prod_lis_main > div:last-child {margin: 0 0 32px 0;}
.prod_lis_main > div > .img {height: 0; padding-bottom: 60%; overflow: hidden; line-height: 0; font-size: 0; position: relative; z-index: 1;}
.prod_lis_main > div > .txt {padding: 20px 15px 90px 15px;}
.prod_lis_main > div > .txt > .tit {color: rgba(0, 0, 0, 0.67); font-weight: 500; line-height: 29px; min-height: 58px; padding: 0 10px 0 0; margin: 0 0 7px 0; transition: all 0.5s ease 0s;}
.prod_lis_main > div:hover > .txt > .tit {color: rgba(66, 93, 145, 0.87);}
.prod_lis_main > div > .txt > .bot {color: #6f6f6f; font-weight: 600; letter-spacing: 1.6px; border-top: 1px solid #e0e0e0; height: 79px; display: flex; flex-flow: wrap; align-items: center; position: absolute; bottom: 0; left: 16px; right: 16px; z-index: 10; padding: 1px 0 0 1px; transition: all 0.5s ease 0s;}
.prod_lis_main > div:hover > .txt > .bot {color: #d55952;}
.prod_lis_main > div > .txt > .bot::after {content: ''; background: url("../images/icon_04f.png") no-repeat center / cover; width: 37px; height: 38px; position: absolute; top: calc(50% - 20px); right: 0; z-index: 1;}
.prod_sub {display: flex; flex-flow: wrap; padding: 8px 0 8.72% 2px;}
.prod_sub_lef {width: 44.954%;}
.prod_sub_rig {width: 55.046%; padding: 0 0 0 6.069%;}
.prod_sub_rig > .tit_a {padding: 0; margin: -3px 0 7.08% -1px;}
.test_a {padding-bottom: 9%; line-height: 0; font-size: 0;}
.prod_sub_rig > .sha {margin: 4px 0 20px -1px;}
.prod_sub_rig > .don {display: flex; flex-flow: wrap; padding: 28px 0;}
.prod_sub_rig > .don > div {display: flex; flex-flow: wrap; align-items: center; padding: 0 3.667% 0 0; position: relative; z-index: 1;}
.prod_sub_rig > .don > div > .img {width: 78px;}
.prod_sub_rig > .don > div > .img > .pho {width: 63px; height: 63px; border-radius: 50%; border: 1px solid #9e9e9e; display: flex; flex-flow: wrap; justify-content: center; align-items: center;}
.prod_sub_rig > .don > div:hover > .img > .pho {border: 1px solid #556fb5;}
.prod_sub_rig > .don > div > .img > .pho img {max-height: 100%;}
.prod_sub_rig > .don > div > .img > .pho img:nth-child(1) {display: block;}
.prod_sub_rig > .don > div > .img > .pho img:nth-child(2) {display: none;}
.prod_sub_rig > .don > div:hover > .img > .pho img:nth-child(1) {display: none;}
.prod_sub_rig > .don > div:hover > .img > .pho img:nth-child(2) {display: block;}
.prod_sub_rig > .don > div > .txt {width: calc(100% - 78px); color: #000; font-weight: 600; line-height: 1.2143; padding: 0 0 2px 0; margin: 0; position: relative; z-index: 1; transition: all 0s ease 0s;}
.prod_sub_rig > .don > div > .txt::after {content: ''; background: rgba(0, 0, 0, 0.12); width: 55%; max-width: 53px; height: 1px; position: absolute; top: calc(100% + 1px); left: 0;}
.prod_sub_rig > .don > div:hover > .txt {color: #556fb5; transition: all 0s ease 0s;}
.prod_sub_rig > .don > .don_1 {width: 27.435%;}
.prod_sub_rig > .don > .don_2 {width: 27.435%;}
.prod_sub_rig > .don > .don_2 > .txt {letter-spacing: 0.5px;}
.prod_sub_rig > .don > .don_3 {width: 31.986%;}
.prod_sub_rig > .don > .don_3 > .txt {letter-spacing: 0.5px;}
.prod_sub_rig > .bot {display: flex; flex-flow: wrap; align-items: center; padding: 18px 0 0 0; position: relative; z-index: 1;}
.prod_sub_rig > .bot a:link, .prod_sub_rig > .bot a:visited {transition: all 0s ease 0s;}
.prod_sub_rig > .bot a:active, .prod_sub_rig > .bot a:hover {text-decoration:none; transition: all 0s ease 0s;}
.prod_sub_rig > .bot > .bot_In {width: 28.067%; height: 56px; border-radius: 4px; border: 1px solid #556fb5; background: #556fb5; color: #fff; letter-spacing: 1.5px; display: flex; flex-flow: wrap; justify-content: center; align-items: center; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.21); padding: 2px 0 0 1px; margin: 0 13px 0 0;}
.prod_sub_rig > .bot > .bot_In::before {content: ''; background: url("../images/icon_04k.png") no-repeat center / cover; width: 18px; height: 17px; display: block; margin: -2px 13px 0 0;}
.prod_sub_rig > .bot > .bot_Ba {width: 28.067%; height: 56px; border-radius: 4px; border: 1px solid #666666; background: #fff; color: rgba(0, 0, 0, 0.77); font-weight: 500; letter-spacing: 1.6px; display: flex; flex-flow: wrap; justify-content: center; align-items: center; padding: 2px 0 0 9px; margin: 0 8.977% 0 0;}
.prod_sub_rig > .bot > .bot_Ba::before {content: ''; background: url("../images/icon_04l.png") no-repeat center / cover; width: 17px; height: 17px; display: block; margin: -2px 10px 0 0;}
.prod_sub_rig > .bot > .bot_Pr {width: 44px; height: 44px; border-radius: 44px; border: 1px solid #dfdfdf; background: #fff; position: relative; z-index: 1; font-size: 0; line-height: 0; margin: 0 7px 0 0;}
.prod_sub_rig > .bot > .bot_Pr::before {content: ""; position: absolute; left: 16px; top:15px; width: 12px; height: 12px; border-width: 0 0 2px 2px; border-style: solid; border-color: #8a8a8a; transform: rotate(45deg);}
.prod_sub_rig > .bot > .bot_Ne {width: 44px; height: 44px; border-radius: 44px; border: 1px solid #dfdfdf; background: #fff; position: relative; z-index: 1; font-size: 0; line-height: 0;}
.prod_sub_rig > .bot > .bot_Ne::after {content: ""; position: absolute; right: 16px; top:15px; width: 12px; height: 12px; border-width: 2px 2px 0 0; border-style: solid; border-color: #8a8a8a; transform: rotate(45deg);}
.prod_sub_rig > .bot > .bot_In:hover, .prod_sub_rig > .bot > .bot_Ba:hover {background: #d55952; color: #fff; border: 1px solid #d55952;}
.prod_sub_rig > .bot > .bot_Ba:hover::before {background: url("../images/icon_04lh.png") no-repeat center / cover;}
.prod_sub_rig > .bot > .bot_Pr:hover, .prod_sub_rig > .bot > .bot_Ne:hover {width: 42px; height: 42px; border: 1px solid #556fb5; background: #556fb5;}
.prod_sub_rig > .bot > .bot_Pr:hover::before, .prod_sub_rig > .bot > .bot_Ne:hover::after {top:13px; border-color: #fff;}
.prod_sub_bot {width: 100%; padding: 70px 0 0 0;}
.demo_A {display: flex; flex-flow: wrap;}
.demo_A .tit {color: #000; font-weight: 700; line-height: 1.083333; letter-spacing: 0; margin: 0 0 32px 0;}
.demo_A > .lef {width: 51.135%; padding: 0 6.53% 0 0;}
.demo_A > .rig {width: 48.865%;}
.demo_B {margin: -19px 0 0 0;}
.demo_B .tit {color: #000; font-weight: 700; line-height: 1.083333; letter-spacing: 0; padding: 3px 0 0 0; margin: 0px 0 10px 0;}
.demo_B > .mar {font-weight: 700; display: flex; flex-flow: wrap; align-items: center; padding: 0 0 21px 0;}
.demo_B > .mar img {margin: -2px 6px 0 1px;}
.demo_B > .mar > div {padding: 0 19px 0 0;}
.demo_C {display: flex; flex-flow: wrap; font-size: 18px; margin: -5px 0 0 0;}
.demo_C .tit {color: #000; font-size: 24px; font-weight: 700; line-height: 1.5; letter-spacing: 0; margin: 0 0 35px 0;}
.demo_C > .lef {width: 51.135%; padding: 0 6.53% 0 0;}
.demo_C hr {border-width: 2px; border-color: #c9c9c9; height: 2px; line-height: 0; font-size: 0; padding: 0;}
.demo_C > .lef > .lis {display: flex; flex-flow: wrap; line-height: 2; padding: 35px 0 0 0;}
.demo_C > .lef > .lis > div.ite {width: 95px; text-align: right; font-weight: 700; padding: 0 4px 0 0; margin: 0;}
.demo_C > .lef > .lis > div.con {width: calc(100% - 95px);}
.demo_C > .rig {width: 48.865%; font-size: 20px; line-height: 1.8;}
.demo_C > .rig > .con {padding: 107px 0 0 0; margin: 0;}


.related_pro {background: #d1f0ff; padding: 5.431% 0 5.536% 8px;}
.related_pro > .frame_1617 > .tit {color: #000; font-weight: 500; line-height: 1.083333; letter-spacing: 0.1px; padding: 0 0 12px 0; margin: 0 0 2.041% 0; position: relative; z-index: 1;}
.related_pro > .frame_1617 > .tit::before {content: ''; background: #dbdbdb; height: 1px; position: absolute; top: calc(100% + 1px); left: 1px; width: 100%; z-index: 1;}
.related_pro > .frame_1617 > .tit::after {content: ''; background: #425d91; height: 1px; position: absolute; top: calc(100% + 1px); left: 1px; width: 100%; max-width: 231px; z-index: 2;}
.related_pro .owl-carousel {width: 100.3%; margin: 0 0 0 -4px;}
.related_pro .owl-carousel .item {padding: 5px;}
.related_pro .owl-carousel .item > .con {width: 100%; max-width: 370px; position: relative; z-index: 1; border-radius: 4px; overflow: hidden; background: #fff; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.24);}
.related_pro .owl-carousel .item > .con > .img {height: 0; padding-bottom: 60%; overflow: hidden; line-height: 0; font-size: 0; position: relative; z-index: 1;}
.related_pro .owl-carousel .item > .con > .txt {padding: 20px 15px 90px 15px;}
.related_pro .owl-carousel .item > .con > .txt > .tit {color: rgba(0, 0, 0, 0.67); font-weight: 500; line-height: 29px; height: 58px; padding: 0 10px 0 0; margin: 0 0 7px 0; transition: all 0.5s ease 0s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.related_pro .owl-carousel .item > .con:hover > .txt > .tit {color: rgba(66, 93, 145, 0.87);}
.related_pro .owl-carousel .item > .con > .txt > .bot {color: #6f6f6f; font-weight: 600; letter-spacing: 1.6px; border-top: 1px solid #e0e0e0; height: 79px; display: flex; flex-flow: wrap; align-items: center; position: absolute; bottom: 0; left: 16px; right: 16px; z-index: 10; padding: 1px 0 0 1px; transition: all 0.5s ease 0s;}
.related_pro .owl-carousel .item > .con:hover > .txt > .bot {color: #d55952;}
.related_pro .owl-carousel .item > .con > .txt > .bot::after {content: ''; background: url("../images/icon_04f.png") no-repeat center / cover; width: 37px; height: 38px; position: absolute; top: calc(50% - 20px); right: 0; z-index: 1;}


.appl_wrap {position: relative; z-index: 1; background: url("../images/bg_04.png") no-repeat bottom center / 100%; padding: 0 5px 17px 0;}
.test_b {padding-bottom: 4px; line-height: 0; font-size: 0;}
.appl_lis {display: flex; flex-flow: wrap; width: 100%; max-width: 1488px; padding: 5.195% 0 0 2px; margin: auto;}
.appl_lis > div {width: 29.476%; margin: 0 5.451% 109px 0; position: relative; z-index: 1;}
.appl_lis > div:nth-child(3n+3), .appl_lis > div:last-child {margin: 0 0 109px 0;}
.appl_lis > div > .img {height: 0; padding-bottom: 100%; position: relative; z-index: 1; margin: 0 0 9.59% 0;}
.appl_lis > div > .img > .pho {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; border: 10px solid #425d91; border-radius: 50%; overflow: hidden; background: #fff;}
.appl_lis > div > .img > .pho > img {position: absolute; top: 50%; left: 50%; display: block; width: 100%; height: 100%; object-fit:cover; transform:translate(-50%,-50%) scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.appl_lis > div:hover > .img > .pho > img {transform:translate(-50%,-50%) scale(1.1, 1.1);}
.appl_lis > div > .img > .ico {width: 128px; height: 128px; display: flex; flex-flow: wrap; justify-content: center; align-items: center; text-align: center; position: absolute; top: 1px; right: 29px; z-index: 10;}
.appl_lis > div > .img > .ico::before {content: ''; background: #d55952; width: 66.41%; height: 132.82%; border-radius: 0 85px 85px 0; position: absolute; top: 1px; left: calc(50% + 1px); z-index: -10; transition: all 0.25s ease 0s;}
.appl_lis > div:hover > .img > .ico::before {width: 132.82%; left: -16.41%; top: -16.41%; border-radius: 50%;}
.appl_lis > div > .img > .ico::after {content: ''; background: #5a96cc; border: 5px solid #fff; border-radius: 50%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10;}
.appl_lis > div > .img > .ico img {width: 63.29%; position: relative; z-index: 100;}
.appl_lis > div > .tit {width: 100%; max-width: 420px; background: #fff; border: 3px solid #425d91; color: #666666; font-weight: 700; text-align: center; line-height: 1.0833333; border-radius: 58px; padding: 11px 50px 15px 50px; margin: auto; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.appl_lis > div:hover > .tit {background: #d45952; color: #fff;}
.appl_lis > div > .tit::after {content: ''; background: url("../images/icon_04n.png") no-repeat center / cover; width: 38px; height: 38px; position: absolute; top: calc(50% - 19px); right: 9px;}


.news_wrap {position: relative; z-index: 1; padding: 0 0 2.709% 0;}
.news_lis {display: flex; flex-flow: wrap; padding: 1.547% 0 1.052% 0;}
.news_lis > div {width: 31.355%; max-width: 507px; margin: 0 2.536% 38px 0; background: #fff; position: relative; z-index: 1;}
.news_lis > div:nth-child(3n+3), .news_lis > div:last-child {margin: 0 0 38px 0;}
.news_lis > div > .img {height: 0; padding-bottom: 66.47%; position: relative; z-index: 1; overflow: hidden;}
.news_lis > div > .img img {transform: scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.news_lis > div:hover > .img img {transform: scale(1.2, 1.2);}
.news_lis > div > .txt {position: relative; z-index: 5; border: 1px solid #e0e0e0; border-top: none; padding: 8.09% 6.51% 8.876% 7.496%;}
.news_lis > div > .txt > .dat {background: #1d9ecc; width: 83px; height: 93px; position: absolute; bottom: calc(100% - 13px); left: 6.933%; z-index: 10; color: #fff; font-weight: 500; line-height: 1; text-align: center; display: flex; flex-flow: column; align-items: center; justify-content: center; padding: 0 2px 0 0;}
.news_lis > div > .txt > .dat span {font-size: 136%; margin: 0;}
.news_lis > div > .txt > .dat label {font-size: 106%; font-weight: 400; padding: 4px 0 6px 0; margin: 0;}
.news_lis > div > .txt > .tit {color: #333; line-height: 1.33333; letter-spacing: 0.1px; font-weight: 600; margin: 0 0 6.222% 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; transition: all 0.5s ease 0s;}
.news_lis > div:hover > .txt > .tit {color: #d55446;}
.news_lis > div > .txt > .fon {color: #4d4d4d; line-height: 1.33333; letter-spacing: 0.07px; margin: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.news_lis > div > .txt > .bot {width: 187px; height: 45px; color:#fff; background: #425d91; display: flex; flex-flow: wrap; justify-content: center; align-items: center; font-weight: 500; letter-spacing: -0.2px; position: absolute; bottom: calc(100% - 12px); right: -1px; z-index: 10; padding: 2px 0 0 1px; transition: all 0.5s ease 0s;}
.news_lis > div:hover > .txt > .bot {padding: 2px 0 0 5px;}
.news_lis > div > .txt > .bot img {margin: -1px 0 0 6px; transition: all 0.5s ease 0s;}
.news_lis > div:hover > .txt > .bot img {margin: -1px 0 0 9px;}
.news_lis > div:hover > .txt > .bot {background: #d55446;}


.cont_wrap {position: relative; z-index: 1;}
.cont_form {background: rgba(240, 243, 246, 0.7); box-shadow: 0 1px 14px rgba(101, 99, 99, 0.5); border-radius: 14px; color: #000; display: flex; flex-flow: wrap; padding: 72px 7.236% 70px 6.494%; margin: -4px 2px 8.782% -1px; position: relative; z-index: 1;}
.cont_form label {color: #ff0000; padding: 0 0 0 11px;}
.cont_form > .lef {width: 47.633%; margin: 0 8.322% 0 0;}
.cont_form > .rig {width: 44.046%; padding: 1px 0 0 0;}
.row_a {display: flex; flex-flow: wrap; padding: 0 0 20px 0;}
.row_b {display: flex; flex-flow: wrap; padding: 0 0 43px 0;}
.row_c {font-weight: 500; padding: 11px 0 0 26.5px; position: relative; z-index: 1;}
.row_c label {position: absolute; top: 11px; left: 0;}
.col_a {width: 211px; letter-spacing: 0.1px; padding: 9px 10px 0 0;}
.col_b {width: calc(100% - 211px);}
.col_c {width: calc(100% - 211px); display: flex; flex-flow: wrap; justify-content: space-between;}
.col_e {width: 161px; letter-spacing: 0.1px; padding: 13px 10px 0 0;}
.col_f {width: calc(100% - 161px);}
.cont_form textarea {width: 100%; height: 317px; border-radius: 27px; display: flex; padding: 12px 29.5px; border: 2px solid #558af2; font-weight: 400; letter-spacing: 0; color: #000; background-color: #fff;}
.cont_form textarea::placeholder {color:#bbbdc0 !important; font-weight:400 !important;}/* Firefox, Chrome, Opera */
.cont_form textarea:-moz-placeholder {color:#898989 !important; font-weight:400 !important;}/* Mozilla Firefox 4 to 18 */
.cont_form textarea::-moz-placeholder {color:#898989 !important; font-weight:400 !important;}/* Mozilla Firefox 19+ */
.cont_form textarea:-ms-input-placeholder {color:#898989 !important; font-weight:400 !important;}/* Internet Explorer 10-11 */
.cont_form textarea::-ms-input-placeholder {color:#898989 !important; font-weight:400 !important;}/* Microsoft Edge */
.cont_form textarea::-webkit-input-placeholder {color:#898989 !important; font-weight:400 !important;}/* WebKit browsers */
.cont_form > .bot {width: 100%; display: flex; flex-flow: wrap; justify-content: center; position: absolute; left: 3px; bottom: -29px;}
.cont_form > .bot button {width: 16.028%; height: 50px; border-radius: 50px; border: 2px solid #4563ab; background: #fff; color: #558af2; text-align: center; display: flex; flex-flow: wrap; justify-content: center; align-items: center; margin: 5px 0.898%; cursor: pointer; transition: all 0.5s ease 0s;}
.cont_form > .bot button:hover {background: #558af2; color: #fff;}
.cont_map {position: relative; height: 0; overflow: hidden; padding-bottom: 27.865%;}
.cont_map iframe, .cont_map object, .cont_map embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.svc-content{display: grid;grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap:0px 2%;}
.svc-content .svc-item{background: #fafafc;position: relative;padding: 120px 0 45px 0;box-shadow: 0 25px 35px rgba(0, 0, 0, 0.1);display: grid; grid-template-rows: subgrid;grid-row: span 3; gap:40px 0;margin: 0 0 80px 0;transition: all 0.5s ease 0s;}
.svc-content .svc-item .number{font-size: clamp(80px, 12vw, 140px);line-height: 1;color: #f1f1f3;letter-spacing: -2px;position: absolute;top: 30px;left: 25px;z-index: 1;transition: all 0.5s ease 0s;}
.svc-content .svc-item .copywriting{position: relative; z-index: 2; margin: 0 35px;}
.svc-content .svc-item .copywriting .txt{margin: 0; padding: 0;transition: all 0.5s ease 0s;}
.svc-content .svc-item .wire{background: #f1f1f3; height: 2px;margin: 0px 35px; position: relative;transition: all 0.5s ease 0s;}
.svc-content .svc-item .wire .schedule{background: #f1f1f3; height: 2px;position: absolute;top: 0;left: 0;width: 8.33%;background: #425d91;transition: all 0.5s ease 0s;overflow: hidden;}
.svc-content .svc-item .img{margin-right: 35px;}
.svc-content .svc-item .img .img-center{width: 100%;padding-right: 35px; overflow: hidden;position: relative;height: 0;padding-bottom: 86.3%;}
.svc-content .svc-item .img .img-center .img-item {position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;flex-wrap: wrap;font-size: 0;line-height: 0;}
.svc-content .svc-item .img img{transition: all 0.5s ease 0s;object-fit: cover;height: 100%!important;}

.svc-content .svc-item .wire .wire_01{left: calc(100% / 12 * 0);}
.svc-content .svc-item .wire .wire_02{left: calc(100% / 12 * 1);}
.svc-content .svc-item .wire .wire_03{left: calc(100% / 12 * 2);}
.svc-content .svc-item .wire .wire_04{left: calc(100% / 12 * 3);}
.svc-content .svc-item .wire .wire_05{left: calc(100% / 12 * 4);}
.svc-content .svc-item .wire .wire_06{left: calc(100% / 12 * 5);}
.svc-content .svc-item .wire .wire_07{left: calc(100% / 12 * 6);}
.svc-content .svc-item .wire .wire_08{left: calc(100% / 12 * 7);}
.svc-content .svc-item .wire .wire_09{left: calc(100% / 12 * 8);}
.svc-content .svc-item .wire .wire_10{left: calc(100% / 12 * 9);}
.svc-content .svc-item .wire .wire_11{left: calc(100% / 12 * 10);}
.svc-content .svc-item .wire .wire_12{left: calc(100% / 12 * 11);}

.svc-content .svc-item:hover{background: #617cab; box-shadow: 0px 25px 35px rgba(0, 0, 0, 0.3);transform: scale(1.02);}
.svc-content .svc-item:hover .number{color: #415b8e;}
.svc-content .svc-item:hover .copywriting .txt{color: #fff;}
.svc-content .svc-item:hover .wire{background: #f1f1f3;}
.svc-content .svc-item:hover .wire .schedule{background: #d55952;}
.svc-content .svc-item:hover .img img{transform: scale(1.1);}

@media (max-width: 640px){
	.svc-content .svc-item{margin: 0 0 60px 0;}
}
@media (max-width: 350px){
	.svc-content .svc-item{margin: 0 0 40px 0;}
	.svc-content .svc-item .number{left: 16px;}
	.svc-content .svc-item .copywriting{margin: 0 20px;}
	.svc-content .svc-item .wire{margin: 0 20px;}
	.svc-content{grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));}
	.svc-content .svc-item .img{margin-right: 20px;}
}