@charset "utf-8";
/* layout */
html, body, #wrap{width:100%;height:100%}
#wrap{max-width:1200px; min-width:320px; margin:0 auto;padding-top:31px}
.h_wrap{overflow:hidden}
.h_wrap .logo{display:inline-block;margin-top:17px;margin-right:10px;vertical-align:top}
#content{position:relative}
footer{padding-bottom:20px}
.btn_gnb, .gnb{display:none}
.container .section{display:none}
.container .section.active{display:block;min-height:723px}
.sec_top{padding-top:37px}
.sec_body{padding-bottom:100px}
.column_area{overflow:hidden}
.column_area .col50{float:left;width:50%}
.column_area .col{display:block;overflow:hidden}
/* common */
.foot_share {position:relative; overflow:hidden; display: inline-block; }
.foot_share ul li {float:left; margin-left:7px}
.foot_share ul li:first-child {margin-left:0}
.foot_share img {width:31px; height:31px;}
.foot_txt{padding-top:18px;font-size:12px;color:#000}
.elip{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.elip2{overflow:hidden;text-overflow:ellipsis;line-height:1.5;height:3em;word-wrap:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* button */
.btn{display:inline-block;height:30px;padding:0 37px 0 16px;border-radius:15px;font-size:14px;font-weight:700;color:#131313;line-height:30px}
.btn_more{background:#fff url(../../images/teenager/common/btn_more.png) no-repeat 90% 50%;vertical-align:top}
.bodybg_1 .btn_more,
.bodybg_5887 .btn_more{border:1px solid #ed6409}
.bodybg_2 .btn_more,
.bodybg_5889 .btn_more{border:1px solid #3429a0}
.bodybg_3 .btn_more,
.bodybg_5890 .btn_more{border:1px solid #3429a0}
/*.bodybg_4 .btn_more{border:1px solid #ed6409}*/
/* class */
.mt50p{margin-top:50px}
/* style */
/* body BG */
[class^="bodybg_"]{-webkit-transition: 0.3s;transition: 0.3s}
.bodybg_1, .bodybg_5887{background:#ffa91e}
.bodybg_2, .bodybg_5889{background:#7167d7}
.bodybg_3, .bodybg_5890{background:#9ec43c}
.bodybg_4, .bodybg_5892{background:#61c5f5}
/* LNB */
.lnb_area{margin-top: 40px;}
.lnb_area .tabs:after{display:table; clear:both; content:''}
.lnb_area .tabs>li{position:relative;float:left;margin-left:5px}
.lnb_area .tabs>li:nth-of-type(0n+5)>.tabs_dep2>li:first-of-type a {max-width: 200px;}
.lnb_area .tabs [class^="btn_lnb_"] {display:block; position:relative; width:102px; height:102px; padding-top:30px; background:url(../../images/teenager/common/bg_lnb.png) no-repeat 0 0;text-align:center}
.lnb_area .tabs [class^="btn_lnb_"] .txt{display:inline-block; width:71px; line-height:1.4; word-break: keep-all; font-size:16px; color:#fff;}
.lnb_area .active>[class^="btn_lnb_"]{width:auto;min-width: 160px;margin:0 50px;background:#002545;}
.lnb_area .active>[class^="btn_lnb_"] .txt{position:absolute;width:100%;top:0;left:0;font-size:20px;padding: 10px 0 4px;text-align:left; font-weight:700; border-bottom:1px solid #384958;}
.lnb_area .active > .btn_lnb_1 .txt {color:#ffa91e;}
.lnb_area .active > .btn_lnb_2 .txt {color:#7167d7;}
.lnb_area .active > .btn_lnb_3 .txt {color:#9ec43c;}
.lnb_area .active > .btn_lnb_4 .txt {color:#73eaff;}
.lnb_area .active>[class^="btn_lnb_"]:before{position:absolute; top:0; left:-50px; width:54px; height:102px; background:url(../../images/teenager/common/bg_lnb_before.png) no-repeat 0 0; content:''}
.lnb_area .active>[class^="btn_lnb_"]:after{position:absolute; top:0; right:-50px; width:54px; height:102px; background:url(../../images/teenager/common/bg_lnb_after.png) no-repeat 0 0; content:''}
.lnb_area .tabs_dep2{display:none;padding:0 50px;margin-top:-75px}
.lnb_area .tabs_dep2 li{margin-left:20px}
.lnb_area .tabs_dep2 li:first-child {margin-left:0;}
.lnb_area .active .tabs_dep2{display:table;margin-top: -57px; }
.lnb_area .tabs_dep2 [class^="btn_lnb2"]{display:table-cell; max-width:80px; height:50px; padding-left:0px;/* border-left:1px solid #4d677d */}
.lnb_area .tabs_dep2 .offset1 .btn_lnb2{max-width:110px}
.lnb_area .btn_lnb_2 + .tabs_dep2 .btn_lnb2{max-width:100px}
.lnb_area .btn_lnb_3 + .tabs_dep2 .btn_lnb2{max-width:100px}
.lnb_area .btn_lnb_4 + .tabs_dep2 .btn_lnb2{max-width:75px}
.lnb_area .tabs_dep2 [class^="btn_lnb2"] .txt{display:block;font-size:15px;line-height:1.4; color:#b0bdc8; word-break:keep-all;}
.bodybg_1 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt,
.bodybg_5887 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt{color:#fff; font-weight:700;}
.bodybg_2 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt,
.bodybg_5889 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt{color:#fff; font-weight:700;}
.bodybg_3 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt,
.bodybg_5890 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt{color:#fff; font-weight:700;}
.bodybg_4 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt,
.bodybg_5892 .lnb_area .tabs_dep2 li.active [class^="btn_lnb2"] .txt{color:#fff; font-weight:700;}
.lnb_area .tabs_dep2 .offset2{position:absolute;top:52px;left:141px}
.lnb_area .tabs_dep2 .offset1 .btn_lnb2{vertical-align:top}
.lnb_area .tabs_dep2 .offset2 .btn_lnb2{width:110px;height:auto;padding:1px 0 3px 10px}
.lnb_area .tabs_dep2 [class^="offset"] .txt{font-size:15px}
.lnb_area .tabs_dep2 .offset2 .txt{display:block}
/* breadcrumb */
.breadcrumb li{display:inline-block;vertical-align:top}
.breadcrumb li:before{display:inline-block; content:'〉'; margin:0 4px 0 1px; vertical-align:middle; font-size:10px; font-weight:700}
.breadcrumb li:first-child:before{content:''}
.breadcrumb li a{font-size:14px}
.breadcrumb .active a{font-weight:700}
/* tab_area */
.tab_area{padding-bottom:50px}
.tab_area .tabs{display:table;margin-left:-20px}
.tab_area .tabs li{display:table-cell;width:1%;padding-left:20px;text-align:center;vertical-align:middle}
.tab_area .tabs .obj{display:block;height:50px;background-color:#eb6400;border-radius:13px;line-height:50px;font-size:22px;font-weight:700}
.bodybg_1 .tab_area .tabs .obj,
.bodybg_5887 .tab_area .tabs .obj{color:#ffa91e}
.bodybg_2 .tab_area .tabs .obj,
.bodybg_5889 .tab_area .tabs .obj{color:#7167d7}
.bodybg_3 .tab_area .tabs .obj,
.bodybg_5890 .tab_area .tabs .obj{color:#9ec43c}
.bodybg_4 .tab_area .tabs .obj,
.bodybg_5892 .tab_area .tabs .obj{color:#61c5f5}
.tab_area .tabs .active .obj{color:#fff}
/* font, title */
.content_title{padding:16px 0 49px; line-height:1.1; font-size:40px; font-weight:700; color:#fff}
.cont_txt{padding-bottom:39px}
[class^="title_"]{display:inline-block}
.title_big{font-size:30px;font-weight:700}
.title_bold{font-size:18px;font-weight:700}
.title_red{font-size:24px;font-weight:700;color:#df2f00}
.title_blue{font-size:24px;font-weight:700;color:#73eaff}
.title_darkblue{font-size:24px;font-weight:700;color:#2860ff}
.s_title_wh{font-size:20px;color:#fff}
.txt_plain{padding-top:12px;line-height:1.5}
.txt_story{word-break:keep-all}
.txt_story p{padding-top:33px;line-height:1.5}
.list_dash{padding-top:12px}
.list_dash li{line-height:1.5}
.list_dash li:before{display:inline-block;content:'-';margin-right:3px}
/* board --video_list */
.video_list{padding-bottom:70px}
.video_list>li{display:inline-block;padding-top:30px;margin-left:-4px;vertical-align:top}
.video_list .obj{overflow:hidden;display:block;color:#131313}
.video_list .img_area,
.video_list .frm_area{display:block;position:relative;overflow:hidden;background-color:#4c42b2;text-align:center}
.video_list .img_thumb{width:auto;height:100%;margin:0 -240px}
/*.video_list .img_area:after{display:inline-block;position:absolute;top:0;left:0;width:100%;height:100%;content:'';background:url(../../images/teenager/common/ico_video_play.png) no-repeat 50%}*/
.video_list.col_3 {margin-left:-53px}
.video_list.col_3>li{width:33.33%;padding-left:53px}
.video_list.col_3 .img_area,
.video_list.col_3 .frm_area {height:240px;border-radius:20px}
.video_list.col_3 .tit_video{padding:18px 10px 0;text-align:center;font-size:20px}
.video_list.col_2_small{margin-left:-70px}
.video_list.col_2_small>li{width:50%;padding-left:70px}
.video_list.col_2_small .img_area{float:left;width:204px;height:140px;margin-right:20px;border-radius:10px}
.video_list.col_2_small .tit_video{display:block;overflow:hidden}
.video_list.col_2_small .tit_video span[class^="t_"]{display:block}
.video_list.col_2_small .tit_video .t_tit{font-size:20px;padding-top:28px}
.video_list.col_2_small .tit_video .t_url{padding-top:5px;word-break:break-all}
/* board --thumb */
.thumb_list{padding-bottom:65px}
.thumb_list>li{display:inline-block;padding-top:25px;margin-left:-4px;vertical-align:top}
.thumb_list .obj{overflow:hidden;display:block;color:#131313}
.thumb_list .img_area{display:block;position:relative;overflow:hidden;background-color:#4c42b2;text-align:center}
.thumb_list .img_thumb{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;margin:0 -240px}
.thumb_list.col_4 {margin-left:-35px}
.thumb_list.col_4>li{width:25%;padding-left:35px}
.thumb_list.col_4 .img_area{height:180px;border-radius:20px}
.thumb_list.col_4 .txt_area{padding:18px 5px 0;text-align:left}
.thumb_list.col_4 .txt_area .tit{position:relative;padding-right:10px;font-size:20px}
.thumb_list.col_4 .txt_area .tit:after {position:absolute;top:0;right:0;content:'';width:8px;height:100%;background:url(../../images/teenager/common/bul_thumb_tit.png) no-repeat 0 45%}
.thumb_list.col_4.webtoon>li {padding-top:0}
.thumb_list.col_4.webtoon .s_title_wh{padding-bottom:15px;padding-left:5px}
.thumb_list.col_4.webtoon .txt_area .tit{padding-right:0}
.thumb_list.col_4.webtoon .txt_area .tit:after{background:none}
.thumb_list.col_4.webtoon .episode_list{overflow:hidden;padding-top:5px}
.thumb_list.col_4.webtoon .episode_list>li{float:left;width:35px;margin:0 5px;color:#131313;text-align:left}
.thumb_list.col_4.webtoon .episode_list>li>a:hover{color:#fff}
/* 페이지별 */
/* 외교부를소개합니다--여러분안녕하세요 */
.introduce_introduce .img_introduce{float:right; padding:33px 0 0 20px}
.introduce_introduce .m_img_introduce{display:none}
/* 외교부를소개합니다--외교부가하는일 */
.introduce_role .cont_top{padding-bottom:48px}
.introduce_role .cont_top ul{overflow:hidden}
.introduce_role .cont_top li{float:left;width:33.33%;padding-right:1px}
.introduce_role .cont_top [class^="obj_"]{height:281px;padding:55px 30px 0 160px;border-radius:25px}
.introduce_role .cont_top .obj_1{background:#f89b0c url(../../images/teenager/common/bg_intd_role_conttop_1.png) no-repeat 19px 17px}
.introduce_role .cont_top .obj_2{background:#f89b0c url(../../images/teenager/common/bg_intd_role_conttop_2.png) no-repeat 26px 19px}
.introduce_role .cont_top .obj_3{background:#f89b0c url(../../images/teenager/common/bg_intd_role_conttop_3.png) no-repeat 13px 20px}
.introduce_role .cont_top [class^="obj_"] p{font-size:18px;word-break:keep-all}
.introduce_role .cont_top [class^="obj_"] .s_txt{padding-top:15px;font-size:14px}
/* 외교부를소개합니다--외교부 조직 */
.introduce_organization{}
.chart_ognz[class^="cont_sec"] { overflow: hidden; padding-bottom: 25px; margin-bottom: 25px; border-bottom: 2px solid #f19100; }
.chart_ognz[class^="cont_sec"]:last-of-type { border-bottom: none; }
.chart_ognz h2 { display: table; float: left; margin-right: 50px; }
.chart_ognz .tit_sec { display: table-cell; vertical-align: middle; width: 140px; height: 40px; border-radius: 7px; font-weight: 700; font-size: 18px; color: #fff; text-align: center; word-break: keep-all; }
.chart_ognz .tit_sec.minister { background: #008a34 url(../../images/teenager/common/bg_intd_ognz_1.png) no-repeat 50% 100% }
.chart_ognz .tit_sec.vice_minister1 { background: #4d49bf url(../../images/teenager/common/bg_intd_ognz_2.png) no-repeat 50% 100% }
.chart_ognz .tit_sec.vice_minister2 { background: #4d49bf url(../../images/teenager/common/bg_intd_ognz_3.png) no-repeat 50% 100% }
.chart_ognz .tit_sec.type_blue_1 { background: #4d49bf }
.chart_ognz .tit_sec.type_blue_2 { background: #4d49bf }
.chart_ognz .tit_sec.type_org_1 { background: #eb6400 }
.chart_ognz .tit_sec.type_org_2 { background: #eb6400 }
.chart_ognz .cont_list { display: grid; gap: 0px 0px; overflow: hidden; }
.chart_ognz .cont_list > li { display: grid; grid-template-rows: auto; grid-template-columns: 136px auto; gap: 0 40px; width: 100%; margin: 0 auto; position: relative; border-bottom: 1px solid rgb(241 145 0 / 86%); padding: 16px 16px; }
.chart_ognz .cont_list > li:first-of-type { border-top: 1px solid rgb(241 145 0 / 86%); }
.chart_ognz .sub1,
.chart_ognz .sub2 { grid-row: 1 / auto; grid-column: 2 / 2; }
.chart_ognz .sub2 > ul,
.chart_ognz .sub3 > ul { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 20px; }
.chart_ognz .sub1 {}
.chart_ognz .sub1 > ul { display: grid; gap: 16px 0; }
.chart_ognz .sub1 > ul > li { display: grid; grid-template-rows: auto; grid-template-columns: 136px auto; gap: 0 40px; }
.chart_ognz .sub2 {}
.chart_ognz .sub2 > ul {}
.chart_ognz .sub2 > ul > li {}
.chart_ognz .sub3 { margin-left: 16px; }
.chart_ognz .sub3 > ul {}
.chart_ognz .sub3 > ul > li {}
.chart_ognz [class^="lv"] {font-size:15px;}
.chart_ognz .lv1,
.chart_ognz .lv2 { grid-row: 1 / auto; grid-column: 1 / 2; display: flex; align-items: center; justify-content: center; width: 136px; height: 40px; border-radius: 6px; line-height: 1; text-align:center; font-weight: 600; }
.chart_ognz .lv1 { background-color: #6a6a6a; color: #fff; }
.chart_ognz .lv2 { background-color: #fff; color: #131313;}
.chart_ognz .lv3 { display: flex; align-items: center; height: 40px; line-height: 1; font-weight: 500; }
.chart_ognz .lv3-tit { font-weight: 600; }
.chart_ognz .fz_small { font-size: 12px; }
.chart_ognz .subtxt { margin-bottom: 8px; text-align: right; font-size: 13px; }
/* 외교부를소개합니다--이렇게 발전해왔어요 */
.introduce_history .cont_top{position:relative}
.introduce_history .cont_top .txt_area{padding:25px 0;border-radius:20px;background-color:#f89b0c;color:#fff;font-weight:500;font-size:17px;line-height:1}
.introduce_history .cont_top .txt_area li{padding-top:12px}
.introduce_history .cont_top .txt_area li:first-child{padding-top:0}
.introduce_history .cont_top h2{padding-bottom:20px;font-weight:500;font-size:20px}
.introduce_history .cont_top .img_gov{float:left;margin-right:30px;border-top-left-radius:20px;border-bottom-left-radius:20px}
.introduce_history .cont_top .m_img_gov{display:none}
.introduce_history .cont_top .img_txt_area{position:absolute;top:-40px;left:900px}
.introduce_history .cont_txt{overflow:hidden;margin-top:50px}
.introduce_history .cont_txt dt{float:left;font-weight:700}
.introduce_history .cont_txt dd{padding-left:130px;padding-bottom:17px}
.introduce_history .cont_txt li{padding-bottom:17px}
.introduce_history .cont_txt span{display:inline-block;width:20px;text-align:right}
/* 외교부를소개합니다--공관에 대해 알아봐요 */
.introduce_d_office .section_1 .top_area{position:relative;height:397px}
.introduce_d_office .section_1 .top_area .bg_img {position:absolute;top:33px;left:295px;width:893px;height:295px;background:url(../../images/teenager/common/bg_intd_office_sec1.png) no-repeat 0 0}
.introduce_d_office .section_1 .bg1 {position:absolute;top:40px;left:10px;width:324px;height:320px;background:url(../../images/teenager/common/bg_intd_office_conttop1.png) no-repeat 0 0;text-align:center}
.introduce_d_office .section_1 .bg2 {position:absolute;top:-30px;right:45px;width:349px;height:345px;background:url(../../images/teenager/common/bg_intd_office_conttop2.png) no-repeat 0 0;text-align:center}
.introduce_d_office .section_1 .bg1 dl{display:inline-block;width:200px;padding-top:87px;color:#002545}
.introduce_d_office .section_1 .bg2 dl{display:inline-block;width:230px;padding-top:107px;color:#002545}
.introduce_d_office .section_1 [class^="bg"] dt{font-size:35px}
.introduce_d_office .section_1 [class^="bg"] dd{padding-top:22px;font-size:18px;word-break:keep-all}
.introduce_d_office .section_1 .info_area {padding-bottom:25px}
.introduce_d_office .section_1 .info_area:last-child{padding-bottom:0}
.introduce_d_office .section_1 .info_area dt{font-size:18px;font-weight:700;padding-bottom:5px}
.introduce_d_office .section_1 .info_area dt:before{display:inline-block;content:'-';padding-right:3px}
.introduce_d_office .section_1 .info_area dd{padding-left:10px}
.introduce_d_office .section_2{margin-top:69px}
.introduce_d_office .section_2 ul{padding-top:30px}
.introduce_d_office .section_2 li{position:relative;padding-bottom:5px;padding-left:12px}
.introduce_d_office .section_2 li:last-child{padding-bottom:0}
.introduce_d_office .section_2 li:before {display:inline-block;position:absolute;top:0;left:0;width:12px;height:100%;;content:'-'}
/* 외교부를소개합니다--어디에 있을까요 */
.introduce_location .map_area{overflow:hidden; border-radius:10px}
.introduce_location .map_area > a {display:block;}
.introduce_location .map{height:100%}
.introduce_location .txt_info{line-height:1.8}
.introduce_location .title_bold{padding-top:50px}
.introduce_location strong{font-weight:700}
.introduce_location .traffic .column_area{padding-top:15px}
.introduce_location .traffic .tit{width:131px;height:56px;font-size:0;line-height:0}
.introduce_location .subway .tit{background:url(../../images/teenager/common/ico_intd_loc_subway.png) no-repeat 0 0}
.introduce_location .bus .tit{background:url(../../images/teenager/common/ico_intd_loc_bus.png) no-repeat 0 0}
.introduce_location .traffic .txt{padding-left:60px}
.introduce_location .traffic .s_tit{display:inline-block;padding-top:17px;padding-bottom:7px}
.introduce_location .traffic .txt .s_tit:first-child{padding-top:0}
.introduce_location .traffic .txt li{padding:4px 0}
.introduce_location .traffic [class^="bus_"]{font-weight:700}
.introduce_location .traffic .bus_g{color:#067b00}
.introduce_location .traffic .bus_b{color:#1f47bb}
.introduce_location .traffic .bus_r{color:#fb1313}
/* 우리함께알아봐요--외교란무엇일까요? */
.information_definition{overflow:hidden}
.information_definition [class^="sec_"]{padding-bottom:60px}
.information_definition [class^="sec_"]:last-child{padding-bottom:0}
.information_definition .txt_area{-webkit-box-sizing:content-box;box-sizing:content-box;float:left;width:306px;min-height:151px;padding-left:134px}
.information_definition .title_blue{padding-bottom:20px}
.information_definition .txt_area dd{line-height:1.6;word-break:keep-all}
.information_definition .txt_area dd i{display:block}
.information_definition .infographics{display:block;overflow:hidden}
.information_definition .sec_1 .txt_area{background:url(../../images/teenager/common/bg_info_def_sec1.png) no-repeat 5px 0}
.information_definition .sec_2 .txt_area {margin-top:28px;background:url(../../images/teenager/common/bg_info_def_sec2.png) no-repeat 5px 0}
.information_definition .sec_3 .txt_area{background:url(../../images/teenager/common/bg_info_def_sec3.png) no-repeat 5px 0}
.information_definition .sec_4 .txt_area{background:url(../../images/teenager/common/bg_info_def_sec4.png) no-repeat 5px 0}
.information_definition .sec_1 .infographics {height:499px;background:url(../../images/teenager/common/img_info_def_sec1.png) no-repeat 50% 0}
.information_definition .sec_2 .infographics {height:202px;background:url(../../images/teenager/common/img_info_def_sec2.png) no-repeat 50% 0}
.information_definition .sec_3 .infographics {height:174px;background:url(../../images/teenager/common/img_info_def_sec3.png) no-repeat 50% 0}
.information_definition .sec_4 .infographics {height:163px;background:url(../../images/teenager/common/img_info_def_sec4.png) no-repeat 50% 20px}
/* 우리함께알아봐요--다양한콘텐츠로함께봐요 */
.information_multimedia .s_title_wh{padding-top:12px;letter-spacing:-1px}
/* 우리함께알아봐요--외교부에서소식이왔어요 */
.information_sns .sec_visual {height:auto;margin-bottom: 25px;margin-top: 50px;}
.information_sns .sec_visual h2{padding-top: 0;font-size:50px;color:#73eaff;font-weight:100;text-align:center;word-break:keep-all;}
.information_sns .sec_visual h2 span{display:block;font-size:30px;font-weight:700}
.information_sns .sns_box{background-color:#7f76db;border-radius:20px;width: 62%;text-align:center;margin: 0 auto;}
.information_sns .sns_box .sns_list{display:inline-block;padding:15px 0}
.information_sns .sns_box .sns_item{display:inline-block;width: 110px;padding:15px 0;margin: 0 27px;vertical-align:top;}
.information_sns .sns_box .sns_item a{display:block;color:#131313; width:93%; word-break:keep-all;word-wrap:break-word;}
.information_sns .sns_box .sns_item a img{width:100%;vertical-align:top}
.information_sns .sns_box .tit{display:block;padding-top:16px}
/* 외교관이될래요--외교관의역할 */
.diplomat_howto section[class^="sec_"]{padding-bottom:70px}
.diplomat_howto section[class^="sec_"]:last-child{padding-bottom:0}
.diplomat_howto .align_indent{overflow:hidden}
.diplomat_howto .align_indent dt{float:left;margin-right:3px}
.diplomat_howto .align_indent dd{display:block;overflow:hidden}
.diplomat_howto .s_tit{font-size:20px;color:#fff;word-break:keep-all}
.diplomat_howto .sec_1 .s_tit{width:691px;padding-top:45px;margin:0 auto;text-align:center}
.diplomat_howto .sec_1 .txt_list {height:314px;margin-top:-16px;background:url(../../images/teenager/common/bg_diplomat_howto_role.png) no-repeat 0 0}
.diplomat_howto .sec_1 .txt_list li{position:absolute;opacity:0;visibility:hidden}
.diplomat_howto .blackboard {overflow:hidden;padding:35px;margin-top:27px;background-color:#006633;border-bottom:17px solid #7d4e24;line-height:1.5}
.diplomat_howto .blackboard [class^="box_"]{width:490px;vertical-align:top;color:#9ec43c}
.diplomat_howto .blackboard .box_1{float:left}
.diplomat_howto .blackboard .box_2{float:right}
.diplomat_howto .blackboard .tit{font-size:18px;color:#fff;font-weight:700}
.diplomat_howto .blackboard .s_txt{;color:#fff}
.diplomat_howto .sec_3 {min-height:319px;background:url(../../images/teenager/common/bg_diplomat_howto_org.png) no-repeat 566px 22px}
.diplomat_howto .sec_3 .s_tit{padding:33px 0 28px}
.diplomat_howto .sec_3 .sns_area{padding-top:29px}
.diplomat_howto .sec_3 .sns_area .tit {display:inline-block;padding-right:15px}
.diplomat_howto .sec_3 .sns_area a {margin-right:12px}
.diplomat_howto .sec_3 .sns_area .btn_area{display:inline-block}
.diplomat_howto .sec_3 .sns_area .btn{margin-top:-6px}
.diplomat_howto .sec_3 .sns_area .btn.twi{background:#55acef url(../../images/teenager/common/foot_twi.png) no-repeat 130% 50%; border-color: #000000; color: #ffffff; }
.diplomat_howto .sec_3 .sns_area .btn.fb{background:#4a67a1 url(../../images/teenager/common/foot_face.png) no-repeat 96% 50%}
/* 외교관이될래요--외교관이야기를들어봐요 */
.diplomat_story .sec_3 {margin-bottom: 70px;}
.diplomat_story .sec_2 .video_list {padding-bottom: 0;}
.diplomat_story .video_list .img_area{background-color:#517c2b}
.diplomat_story .video_list .img_area .img_thumb{width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover}
.diplomat_story .video_list.col_3 .tit_video{text-align:left}
.diplomat_story .video_list.col_3 .s_tit{padding:5px 10px 0}
.diplomat_story .sec_1 .video_list .img_area:after{display:none}
.diplomat_story .sec_3 .title_darkblue{padding-bottom:20px;padding-right:15px}
/* 외교부와함께해요--추천사이트 */
.withmofa_sites {display:inline-block; width:100%; padding-bottom:200px;}
.withmofa_sites [class^="sec_"]{display:inline-block;width:25%;padding-left:40px;vertical-align:top; float:left;}
.withmofa_sites [class^="sec_"] .inner {border:1px solid #613cff; height:365px; border-radius:12px; padding:20px; position:relative;}
.withmofa_sites [class^="sec_"] .inner:after {width:260px; height:147px; display:inline-block; content:''; bottom:-135px;}
.withmofa_sites .sec_1 .inner:after {background:url(../../images/teenager/pic/bg_sec_1.png) 0 0 no-repeat; position:absolute; left:-1px;}
.withmofa_sites .sec_2 .inner:after {background:url(../../images/teenager/pic/bg_sec_2.png) 0 0 no-repeat; position:absolute; left:-1px; width:300px;}
.withmofa_sites .sec_3 .inner:after {background:url(../../images/teenager/pic/bg_sec_3.png) 0 0 no-repeat; position:absolute; left:-1px;}
.withmofa_sites .sec_4 .inner:after {background:url(../../images/teenager/pic/bg_sec_4.png) 0 0 no-repeat; position:absolute; left:-1px;}
.withmofa_sites .sec_1{padding:0; padding-right:40px;}
.withmofa_sites .sec_2{padding:0;}
.withmofa_sites .title_bold{padding-bottom:14px;color:#613cff}
.withmofa_sites .site_list > li{padding-bottom:8px}
.withmofa_sites .site_list + .title_bold{padding-top:35px}
.withmofa_sites .site_list a{display:block;color:#131313}
/* 유튜브 링크 */
.img_area a.youtu img {width: 100%; height: 100%;}
/* [D] */
.br {display: block; }
/* 푸터 */
.symbol {display: inline-block; vertical-align: top; width: 100px; border-right: 1px solid #484848; margin-right: 8px; }
.symbol a {display: block; text-decoration: none;}
.symbol a img {vertical-align: top;}
.symbol a span {font-size: 11px; display: inline-block; width: 41px; margin-left: 4px; color: black; padding-top: 1px; }
.symbol a:hover span {text-decoration: underline; }
/* ============ 미디어쿼리 ============ */
@media(max-width:1366px){
}
@media(max-width:1200px){
/* class */
.m_hide{display:none;}
.m_br{display:block}
.m_show{display:block}
/* layout */
#wrap{max-width:768px;height:100%;margin:0 auto;padding-top:10px}
.h_wrap{position:relative;padding:0 10px}
.h_wrap .logo{margin-top:0}
.btn_gnb{display:block;position:absolute;top:0;right:20px;width:40px;height:34px;padding:5px}
.btn_gnb img{width:100%}
.lnb_area{display:none}
.breadcrumb{display:none}
.sec_top{padding:30px 15px 0}
.sec_body{padding:0 15px 35px}
/* common */
footer{padding:0 20px 20px}
.foot_share {position:relative; overflow:hidden}
.foot_share ul li {float:left; margin-left:7px}
.foot_share ul li:first-child {margin-left:0}
.foot_txt{padding-top:15px;color:#000}
[class^="obj_main_"]>img,[class^="obj_balloon_"] img{display:none}
.foot_share img.m_show{width:31px;height:31px;}
/* mob-GNB */
.gnb {display: block; overflow: hidden; opacity: 0; visibility: hidden; position: fixed; top:0; left:0; width:100%; height:100%; margin-top: 0; z-index: 9999; transition: all 0.5s ease .1s; -webkit-transition: all 0.5s ease .1s}
.gnb .m-nav-bg {visibility: hidden; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 100; opacity: 0; transition: all 0.5s ease .1s; -webkit-transition: all 0.5s ease .1s}
.gnb .gnb-wrap {position: fixed; top: 0; right: -100%; z-index: 200; margin: 0; padding: 0; height: 100%; min-width: 300px; background-color: #002545; transition: all 0.5s ease .1s; -webkit-transition: all 0.5s ease .1s}
.gnb .gnb-wrap .h2-title {width: 100%; height: 60px; line-height: 60px; padding-left: 20px; font-size: 20px; color: #fff; background-color: #000f1f}
.gnb .gnb-wrap .btn-menu-close {position: absolute; top: 15px; right: 15px; width: 30px; height: 30px; font-size: 0; overflow: hidden; text-indent: -999em}
.gnb .gnb-wrap .gnb-container {overflow:auto;height:calc(100% - 60px)}
.gnb .gnb-wrap .gnb-container > ul{padding:20px}
.gnb .gnb-wrap .gnb-container > ul > li {border-top:1px solid #fff; font-size: 18px; padding: 15px 0}
.gnb .gnb-wrap .gnb-container > ul > li a {display: inline-block; width: 100%; line-height: 1.1; padding: 5px 0}
.gnb .gnb-wrap .gnb-container > ul > li > span {display: inline-block; width: 100%; line-height: 1.1; padding: 5px 0; font-weight: 700; font-size: 19px; color:#fff;}
.gnb .gnb-wrap .gnb-container > ul .menu01 {border-top: 0; padding-top: 0}
.gnb .gnb-wrap .gnb-container > ul .menu01 > span {color: #ffa91e}
.gnb .gnb-wrap .gnb-container > ul .menu02 > span {color: #7167d7}
.gnb .gnb-wrap .gnb-container > ul .menu03 > span {color: #9ec43c}
.gnb .gnb-wrap .gnb-container > ul .menu04 > span {color: #61c5f5}
.gnb .gnb-wrap .gnb-container > ul .menu05 a {color: #ffffff}
.gnb .gnb-wrap .gnb-container > ul > li .menu-div > ul > li > a {color: #fff}
.gnb .gnb-wrap .btn-menu-close:before {display: inline-block; content: ''; width: 100%; height: 100%; background: url(../../images/teenager/mobile/btn_gnb_close.png) 0 0 no-repeat; background-size: cover}
.gnb.active_gnb {opacity: 1; visibility: visible; }
.gnb.active_gnb .gnb-wrap {right: 0}
.gnb.active_gnb .m-nav-bg {visibility: visible; opacity: 1}
/* tab_area */
.tab_area{padding:0 15px 24px}
/* font, title */
.content_title{padding:0 0 24px;font-size:25px}
/* board --video_list */
.video_list.col_2_small>li{width:100%;padding-left:70px;margin:0}
/* board --thumb */
.thumb_list.col_4>li{width:50%;padding-left:35px}
.thumb_list.col_4.webtoon .txt_area .tit{height:auto}
/* 페이지별 */
/* 외교부를소개합니다--여러분안녕하세요 */
.introduce_introduce .img_introduce{display:none}
.introduce_introduce .img_area{width:60%;max-width:275px;margin:0 auto}
.introduce_introduce .m_img_introduce{display:block;width:100%;padding-top:15px}
/* 외교부를소개합니다--외교부가하는일 */
.introduce_role .cont_top{padding-bottom:39px}
.introduce_role .cont_top li{display:table;float:none;width:100%;padding:0 0 1px 0}
.introduce_role .cont_top .obj_1{background:#f89b0c url(../../images/teenager/mobile/bg_intd_role_conttop_1.png) no-repeat 16px 13px;background-size:56px 122px}
.introduce_role .cont_top .obj_2{background:#f89b0c url(../../images/teenager/mobile/bg_intd_role_conttop_2.png) no-repeat 19px 11px;background-size:52px 121px}
.introduce_role .cont_top .obj_3{background:#f89b0c url(../../images/teenager/mobile/bg_intd_role_conttop_3.png) no-repeat 22px 11px;background-size:54px 120px}
.introduce_role .cont_top [class^="obj_"]{display:table-cell;vertical-align:middle;height:142px;padding:0 20px 0 85px;margin:0 auto;border-radius:13px}
.introduce_role .cont_top [class^="obj_"] p{font-size:16px}
.introduce_role .cont_top [class^="obj_"] .s_txt{padding-top:8px;font-size:14px}
/* 외교부를소개합니다--조직도 */
.chart_ognz[class^="cont_sec"] {}
.chart_ognz h2 { float: none; width: 100%;}
.chart_ognz .tit_sec { height:40px !important; }
.chart_ognz .tit_sec.minister,
.chart_ognz .tit_sec.vice_minister1,
.chart_ognz .tit_sec.vice_minister2 { background-image: none; }
.chart_ognz .cont_list { grid-template-rows: auto; grid-template-columns: repeat(4, 25%); margin-top: 16px; }
.chart_ognz .cont_list>li { grid-template-rows: 30px auto; grid-template-columns: 100%; gap: 8px 0px; padding: 0 6px; border-bottom: none; }
/* .chart_ognz .cont_list > li:nth-child(even) { float: right; }*/
.chart_ognz .cont_list>li:first-child { border-top: none; }
.chart_ognz .sub2 > ul,
.chart_ognz .sub3 > ul { flex-direction: column; align-items: flex-start; gap: 8px; }
.chart_ognz .sub1 { width: 100%; grid-row: 2 / auto; grid-column: 1/ auto; }
.chart_ognz .sub1 > ul {}
.chart_ognz .sub1 > ul > li { grid-template-rows: 30px auto; grid-template-columns: 100%; gap: 12px 0px; }
.chart_ognz .sub2 { grid-row: 2 / auto; grid-column: 1 / auto; }
.chart_ognz .sub2 li { float:none; }
.chart_ognz .sub3 {}
.chart_ognz .lv1 + .sub2{ padding-top: 10px; }
.chart_ognz .lv1 { width: 100%; height: 30px; }
.chart_ognz .lv2 { width: auto; height: 30px; font-weight: 700; text-align: left; }
.chart_ognz .lv1,
.chart_ognz .lv2 {}
.chart_ognz .lv3 { display: block; height: auto; padding-left: 10px; line-height: 1.4; }
.chart_ognz .lv3:before { content: ''; margin: 0; }
.chart_ognz .lv3-tit { margin-bottom: 8px; }
.chart_ognz .subtxt { margin: 8px 0 0 0; }
/* 외교부를소개합니다--이렇게 발전해왔어요 */
.introduce_history .cont_top .txt_area{position:relative;padding:12px 0 12px 20px;margin-top:3px;border-radius:10px;font-size:14px}
.introduce_history .cont_top .txt_area li{padding-top:7px}
.introduce_history .cont_top h2{padding-bottom:12px;font-size:16px}
.introduce_history .cont_top .img_gov{display:none}
.introduce_history .cont_top .m_img_gov{display:block;width:100%;border-radius:10px}
.introduce_history .cont_top .img_txt_area {position:absolute;top:-83px;right:-7px;left:auto;width:110px;height:128px}
.introduce_history .cont_txt{margin-top:30px}
.introduce_history .cont_txt dt{float:left;font-weight:700;font-size:14px}
.introduce_history .cont_txt dd{padding-left:80px;padding-bottom:9px;font-size:14px}
.introduce_history .cont_txt span{display:inline-block;width:15px;text-align:right}
/* 외교부를소개합니다--공관에 대해 알아봐요 */
.introduce_d_office .section_1 .top_area{height:auto}
.introduce_d_office .section_1 .top_area .bg_img{position:static;width:500px;height:630px;margin:0 auto;background:url(../../images/teenager/mobile/bg_intd_office_sec1.png) no-repeat 0 0;background-size:cover}
.introduce_d_office .section_1 .bg1,
.introduce_d_office .section_1 .bg2 {overflow:hidden;top:-1px;left:-1px;width:1px;height:1px;opacity:0;visibility:hidden;font-size:0}
.introduce_d_office .section_1 .info_area dt{font-size:16px}
.introduce_d_office .section_2{margin-top:35px}
.introduce_d_office .section_2 ul{padding-top:15px}
/* 외교부를소개합니다--어디에 있을까요 */
.introduce_location .title_bold{padding-top:30px}
.introduce_location .traffic .column_area{padding-top:10px}
/* 우리함께알아봐요--외교란무엇일까요? */
.information_definition [class^="sec_"]{padding-bottom:30px}
.information_definition [class^="sec_"] .txt_area {-webkit-box-sizing:border-box;box-sizing:border-box;float:none;width:100%;padding-left:90px;background-size:65px auto}
.information_definition .sec_2 .txt_area{margin-top:0}
.information_definition [class^="sec_"] .infographics {background-size:70%;background-position:50% 0}
.information_definition .sec_1 .infographics {height:302px;background-size:60%}
.information_definition .sec_2 .infographics{height:171px}
.information_definition .sec_3 .infographics{height:149px}
.information_definition .sec_4 .infographics{height:149px}
.information_definition .txt_area dd{line-height:1.4}
/* 우리함께알아봐요--외교부에서소식이왔어요 */
.information_sns .sec_visual h2{font-size:30px}
.information_sns .sec_visual h2 span{font-size:20px}
.information_sns .sec_visual {margin-bottom:30px;background-size:65% auto;background-position:50% 100%}
.information_sns .sns_box .sns_item{width:89px;margin:0 10px;padding:10px 0}
.information_sns .sns_box .tit {font-size: 14px;padding-top: 7px;}
/* 외교관이될래요--어떻게외교관이 되나요 */
.diplomat_howto section[class^="sec_"]{padding-bottom:35px}
.diplomat_howto .s_tit{font-size:18px}
.diplomat_howto .sec_1 .txt_list{height:200px;margin-top:20px;background-size:100%}
.diplomat_howto .sec_1 .s_tit{padding-top:20px}
.diplomat_howto .blackboard{margin-top:10px}
.diplomat_howto .blackboard [class^="box_"] {float:none; width:100%; margin:0 auto}
.diplomat_howto .blackboard .box_1{padding-bottom:20px}
.diplomat_howto .sec_3{min-height:initial;background-size:30%;background-position:517px 20px}
.diplomat_howto .sec_3 .s_tit{padding:10px 0 5px}
/* 외교부와함께해요--추천사이트 */
.withmofa_sites [class^="sec_"]{width:50%;padding:0 10px 24px}
.withmofa_sites [class^="sec_"] .inner:after {display:none;}
.br {display: inline; }
}
@media(max-width:768px){
.tab_area .tabs .obj{font-size:16px}
.tab_area .tabs{margin-left:-8px}
.tab_area .tabs li{padding-left:8px}
/* font, title */
.sec_body{font-size:14px}
.title_big{font-size:18px}
.title_bold{font-size:16px}
.title_red{font-size:18px}
.title_blue{font-size:18px}
.title_darkblue{font-size:18px}
.s_title_wh{font-size:16px}
.txt_story{font-size:14px}
.txt_story p{padding-top:20px}
.txt_plain{padding-top:8px;font-size:14px}
.txt_story{word-break:keep-all}
.txt_story p{padding-top:33px;line-height:1.5}
.list_dash{padding-top:8px}
.list_dash li{font-size:14px}
/* button */
.btn{height:24px;padding:0 30px 0 11px;margin-top:-2px;border-radius:12px;font-size:12px;line-height:24px}
.btn_more{background:#fff url(../../images/teenager/common/btn_more.png) no-repeat 90% 50%}
/* board */
.video_list,
.thumb_list{padding-bottom:25px}
.video_list.col_3{width:100%;margin:0}
.video_list.col_3>li{display:block;width:100%;max-width:420px;padding:0;margin:15px auto 20px}
.video_list.col_3 .tit_video,
.video_list.col_2_small .tit_video .t_tit,
.thumb_list.col_4 .txt_area .tit{padding-top:8px;font-size:15px;font-weight:700}
.thumb_list.col_4 .txt_area .tit:after{display:none}
.video_list.col_2_small .tit_video .t_tit{padding-top:15px}
.thumb_list.col_4.webtoon .s_title_wh{padding-bottom:5px}
.thumb_list.col_4 .txt_area{padding-top:5px}
/* 외교부를소개합니다--조직도 */
.chart_ognz .cont_list > li {}
.introduce_location .traffic .tit{width:97px;height:41px;margin-bottom:10px;background-size:cover}
.introduce_location .traffic .txt{padding-left:40px}
.information_definition [class^="sec_"]{padding-bottom:20px}
.information_definition [class^="sec_"] .txt_area {-webkit-box-sizing:border-box;box-sizing:border-box;float:none;width:100%;min-height:80px;padding-left:60px;padding-bottom:15px;background-size:35px auto}
.information_definition .title_blue{padding-bottom:7px}
.information_definition [class^="sec_"] .infographics {width:85%;height:auto;padding-bottom:33%;margin:0 auto;background-size:cover}
.information_definition .sec_1 .infographics {background-size:59%}
.information_definition .sec_2 .infographics{padding-bottom:27%}
.information_definition .sec_3 .infographics{padding-bottom:24.5%}
.information_definition .sec_4 .infographics{padding-bottom:21%}
.information_sns .sns_box{width:80%;margin:0 auto}
.diplomat_howto .s_tit{font-size:15px}
.diplomat_howto .blackboard{padding:15px}
.diplomat_howto .sec_1 .s_tit{width:100%;text-align:left}
.diplomat_howto .sec_1 .txt_list{overflow:hidden;width:100%;height:auto;margin:15px auto 0;background:none;text-align:center}
.diplomat_howto .sec_1 .txt_list li {position:static;opacity:1;visibility:visible;float:left;width:25%;padding:3px}
.diplomat_howto .sec_1 .txt_list .box{display:table;width:100%;height:120px;padding:15px 10px 10px;background-color:#fff;border-radius:20px;color:#9ec43c}
.diplomat_howto .sec_1 .txt_list .box span{display:table-cell;vertical-align:middle;font-size:16px;font-weight:700;word-break:keep-all}
.diplomat_howto .sec_3{background:none}
.diplomat_howto .sec_3 .sns_area{padding-top:10px}
.diplomat_howto .sec_3 .sns_area a {margin-right:5px}
.diplomat_howto .sec_3 .sns_area img {width:40px}
.diplomat_howto .sec_3 .sns_area .btn{margin-top:-3px}
.withmofa_sites [class^="sec_"] .inner {
height: auto;
}
}
@media(max-width:650px){
.introduce_location .column_area .col50{float:none;width:100%}
.introduce_location .column_area .col{padding-top:10px}
.information_sns .sec_visual{height:auto;background:none}
}
@media(max-width:530px){
/* 외교부를소개합니다--조직도 */
.chart_ognz .cont_list { grid-template-rows: auto; grid-template-columns: repeat(2, 50%); margin-top: 8px; gap: 16px 0px; width: 100%; }
.chart_ognz .cont_list > li { width: 100%; padding: 0 4px; }
.introduce_d_office .section_1 .top_area .bg_img{width:100%;height:auto;padding-bottom:126%}
.information_definition .sec_1 .infographics {height: 280px;background-size: 100%}
.information_sns .sns_box{width:100%}
.diplomat_howto .sec_1 .txt_list li {width:50%}
.withmofa_sites [class^="sec_"] {width: 100%;}
}
@media(max-width:480px){
.video_list.col_2_small .img_area{float:none;width:80%;height:220px;margin:0 auto}
.video_list.col_2_small .tit_video{max-width:300px;margin:0 auto}
.thumb_list.col_4>li{width:100%;margin:0}
.diplomat_howto .sec_3 .sns_area .btn_area{display:block;margin-top:6px}
.information_sns .sns_box .sns_item {width:70px}
.information_sns .sns_box .sns_item{margin:0 15px}
}
@media(max-width:425px){
.introduce_d_office .section_1 .info_area dt{font-size:14px}
.information_definition [class^="sec_"] .infographics {width:100%}
.information_definition .sec_1 .infographics {height: 280px;background-size: 100%}
.information_definition .sec_2 .infographics{padding-bottom:32%}
.information_definition .sec_3 .infographics{padding-bottom:28.8%}
.information_definition .sec_4 .infographics{padding-bottom:25%}
}
@media(max-width:374px){
.symbol {display: block; margin-bottom: 10px; border-right: 0;}
.information_definition .sec_1 .infographics {height: 235px;background-size: 100%}
}
@media(max-width:360px){
.title_big{font-size:16px}
.introduce_role .cont_top .obj_3{height:200px}
.video_list.col_2_small .img_area{width:100%}
.information_sns .sns_box .sns_item{margin:0 10px}
}
/* 질문있어요 2022.05.04 */
.intro_app {margin-top:-9px;font-weight: 600;letter-spacing:-0.1em;width:calc(100% + 24px);margin-bottom: 30px;padding:25px 30px;border-radius:180px;display:table;height:180px;background:#fff url(../../images/teenager/common/bg_intro_app.png) no-repeat right 137px bottom 8px;}
.intro_app .ia_logo {width:130px;height:130px;border-radius: 130px;line-height:100%;background-color: #157efe;text-align:center;display:table-cell;vertical-align:middle;}
.intro_app .ia_logo + div {display:table-cell;vertical-align:middle;padding-left:30px;padding-right:95px;font-size:18px;color:#0b0707;line-height:24px;}
.intro_app .ia_logo + div br {display:none;}
.intro_app dl{font-size:0;line-height:0;margin-top:15px;}
.intro_app dl dt{font-size:18px;line-height:44px;display:inline-block;vertical-align:top;margin-right:7px;}
.intro_app dl dd{font-size:15px;line-height:44px;display:inline-block;vertical-align:top;margin-left:3px;}
.intro_app dl dd a {display:block;min-width:210px;height:44px;padding:0 47px 0 23px;background:url(../../images/teenager/common/btn_intro_app.png) no-repeat right 20px top 13px;color:#fff;border-radius:44px;text-decoration:none;}
.intro_app dl dd a.android {background-color: #41beae;}
.intro_app dl dd a.ios {background-color: #0f6fa2;}
@media screen and (max-width:1224px){
.intro_app {width:100%;}
}
@media screen and (max-width:1200px){
.intro_app {width:calc(100% - 15px);margin-left:15px;margin-top:-8px;padding:0;margin-bottom:17px;border-radius:0;display:block;height:auto;padding-bottom:80px;background-size:auto 47px;background-position:center bottom 14px;}
.intro_app .ia_logo {width:100%;height:50px;border-radius:0;display:block;}
.intro_app .ia_logo:before {display:inline-block;height:100%;vertical-align:middle;content:'';}
.intro_app .ia_logo img{width:44px;}
.intro_app .ia_logo + div {font-size:14px;display:block;padding:0;padding:10px 10px 0;text-align:center;line-height:1.6;}
.intro_app .ia_logo + div br {display:block;}
.intro_app dl {margin-top:13px;}
.intro_app dl dt{font-size:14px;line-height:1.6;display:block;margin-bottom:10px;}
.intro_app dl dd {margin:0 2px;}
.intro_app dl dd a{height:3em;padding:0 37px 0 20px;text-align:left;font-size:14px;line-height:3em;background-size:14px auto;min-width:185px;background-position:right 15px top 1.05em;}
}
@media screen and (max-width:786px){
.intro_app {width:100%;margin-left:0;}
}
@media screen and (max-width:428px){
.intro_app .ia_logo + div {font-size:12px;}
.intro_app dl dt {font-size:12px;}
.intro_app dl dd a {font-size:12px;min-width:164px;
}
@media screen and (max-width:360px){
.intro_app .ia_logo + div {font-size:11px;}
.intro_app dl dt {font-size:11px;}
.intro_app dl dd a {font-size:11px;min-width:154px;}
}