@charset "utf-8";
/*  begin */


.ext_040 { position: relative;}

.ext_040 .depth_wrap { position: relative; background: rgba(0,0,0,.04); border: 2px solid #ddd; box-shadow: 0 0 5px rgba(0,0,0,.15); padding: 15px 10px 5px; border-radius: 10px;}
.ext_040 .depth_nav { display: flex; flex-wrap: wrap; justify-content: center;}
.ext_040 .depth_nav li { margin: 0 3px; margin-bottom: 10px;}
.ext_040 .depth_nav li a { display: block; padding: 0 13px; height: 30px; line-height: 29px; background: #fff; border: 2px solid #dedede; font-size: 15px; border-radius: 30px; transition: all .3s ease; font-weight: bold;}
.ext_040 .depth_nav li a:hover, .ext_040 .depth_nav li a.on { background-color: #3fb3e7; color: #fff; border-color: #00a2ea;}
/*  end */
/*  begin */


.ara_002_01 { position: relative;}

.ara_002_01 .art_list_all { position: relative; padding: 12px 0;}
.ara_002_01 .art_list_all > li { position: relative; margin: 12px 0;}
.ara_002_01 .art_list_all > li > a { position: relative; display: block;}
.ara_002_01 .art_list_all > li > a > span { margin-bottom: 10px; border: 1px solid #eaeaea;}
.ara_002_01 .art_list_all > li > a > span img { transition: opacity .3s ease;}
.ara_002_01 .art_list_all > li > a > div { height: 55px;}
.ara_002_01 .art_list_all > li > a h3 { font-size: 15px; font-weight: normal; line-height: 1.3; height: auto !important; max-height: 42px; margin: 0 0 5px; color: #222;}
.ara_002_01 .art_list_all > li > a b { display: block; line-height: 1; font-size: 11px; color: #777; font-weight: normal;}
.ara_002_01 .art_list_all > li > a:hover h3, .ara_002_01 .art_list_all > li > a:hover b, .ara_002_01 .art_list_all > li > a:hover img { opacity: .7;}

.ara_002_01 .paging { padding-top: 10px;}

.ara_002_01.skinbox .art_list_all { margin-top: -12px;}
/*  end */