@import url('../../../../css/common.css');
@import url('../../../../css/webfont.css');

body, ul, li, ol, dl, dt, dd, p, div, h1, h2, h3, h4, h5{margin:0px;padding:0;list-style:none}
body {font-size:62.5%;color:#000}
::selection {color:#000 !important}
#section {width:100%;height:100%}
#section img{width:100%;display:block}
#section img.no-margin {margin:0}
#section > div{background-color:#fff;background-size:100% auto}
#section div > p span{letter-spacing:0}
#section .main a.close {width:45px;height:45px;display:block;position:fixed;top:0;right:0;z-index:1000}
#section > a img{display:block;width:100%}
#section .sub> div {position:relative}
#section .sub a.back {display:block;position:fixed;width:15%;height:auto;left:0;top:0;z-index: 10;}

/* info_rotate */
.acc_tag{position:absolute;left:-9999px;top:-9999px;visibility:hidden;height:0;width:0;text-indent:-9999px;font-size:0}
.show {display:block}
.hide{display:none}
.ib{display: inline-block;}

/* main */
.sec{padding-top: 19.5%;border-top: 1px solid #fff;background:#fff}
.main .m_txt{padding:0 10%;}
.main .m_txt>dl>dt{padding-bottom: 25px;}
.main .m_txt>dl>dd p:first-child{padding-bottom: 12px;}

.cover{padding:29% 0 37.3%;background:#f8f8f8 url(../img/bg_cover.jpg) no-repeat 50% 0;background-size: 100%;}
.cover h1{margin-bottom:7.7%;}

.outro{padding: 15.5% 0 147.2%;background: #d5d5d5 url(../img/bg_outro.jpg) no-repeat 50% 100%;background-size: 100%;}
.outro .btn{padding-top: 30px;}
.outro .btn a{display: block;width: 62.5%;margin:0 auto;}

.sec-1{padding-bottom: 49%;background: #fff url(../img/bg_page01.jpg) no-repeat 50% 100%;background-size: 100%;}
.sec-1 .sub_tit{padding-bottom: 22px;font-size: 15px;text-align: center;}
.sec-1 .m_txt dd b{display: block;padding: 22px 0;font-size: 15px;font-weight: bold;}

.sec-2{background: #f8f8f8;}
.sec-2 ul{padding-top: 11px;}
.sec-2 ul li{display: table;width: 100%;padding: 30px 0;border-top: 1px solid #e1e1e1;}
.sec-2 ul li dl{display: table-cell;width: 58%;text-align: left;}
.sec-2 ul li dt{padding-bottom: 7px;font-weight: bold;word-spacing:-0.5px}
.sec-2 .img{display: table-cell;width: 42%;padding-right: 5%;vertical-align: middle;}

.sec-thumb{padding:9.4% 10%;background: url(../img/bg_family_hub_story.jpg) no-repeat 50% 0;background-size: 100%;}
.sec-thumb a{display: block;margin-top:3.4%;}
.sec-thumb a:first-child{margin-top:0;}

/* sub */
.pop .tit_txt dt{padding-bottom: 20px;}
.pop .tit_txt dd{color: #fff;font-size: 15px;text-align: center;letter-spacing:-0.4px}
.pop .tit_txt dd.tip{padding-top: 10px;font-size: 12px;}
.pop .m_txt{padding:46px 0;}
.pop .m_txt dl{padding: 46px 10% 0;}
.pop .m_txt dl dt{padding-bottom: 12px;font-size: 15px;text-align: center;letter-spacing:-0.3px}
.pop .m_img{position: relative;padding:15.5% 9.6% 9.5%;background: url(../img/bg_story_03.jpg) no-repeat 50% 0;background-size: 100%;}
.pop .m_img .swiper{overflow: hidden;position: relative;}
.pop .m_img .pagination{position: absolute;top:3.1%;left: 50%;margin-left: -20px;z-index: 100;}
.pop .m_img .pagination:after{content: '';display: block;clear: both;}
.pop .m_img .pagination .swiper-pagination-bullet{float: left;width: 10px;height: 10px;margin-left: 2px;border-radius: 0;opacity: 1;background: url(../img/indicator.png) no-repeat -26px 0;background-size: 36px;}
.pop .m_img .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 24px;background-position: 0 0;}

.pop01 .tit_txt{padding:23.5% 10% 75%;background: url(../img/bg_story01_01.jpg) no-repeat 50% 100%;background-size: 100%;}
.pop01 .tit_txt dd{color: #000;}
.pop01 .m_txt p{padding:0 10% 100%;background: url(../img/bg_story01_02.jpg) no-repeat 50% 100%;background-size: 100%;}
.pop02 .tit_txt{padding:23.5% 10% 64.4%;background: url(../img/bg_story02_01.jpg) no-repeat 50% 100%;background-size: 100%;}
.pop02 .m_txt p{padding:0 10% 110%;background: url(../img/bg_story02_02.jpg) no-repeat 50% 100%;background-size: 100%;}
.pop03 .tit_txt{padding:23.5% 10% 82.5%;background: url(../img/bg_story03_01.jpg) no-repeat 50% 100%;background-size: 100%;}
.pop03 .m_txt p{padding:0 10% 109.5%;background: url(../img/bg_story03_02.jpg) no-repeat 50% 100%;background-size: 100%;}

#section {-webkit-text-size-adjust:none;font-size:1.4em;font-family:secgcm;line-height:24px;letter-spacing:0;text-align:justify}