@charset "utf-8";
@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 200;
    src: local('Nanum Barun Gothic UltraLight'), local('Nanum Barun Gothic-UltraLight'), local('NanumBarunGothic UltraLight');
    /*src: url(font/NanumBarunGothicUltraLight.eot);
    src: url(font/NanumBarunGothicUltraLight.eot?#iefix) format('embedded-opentype'),*/
    src: url(/resources/css/font/NanumBarunGothicUltraLight.woff2) format('woff2'),
    url(/resources/css/font/NanumBarunGothicUltraLight.woff) format('woff'),
    url(/resources/css/font/NanumBarunGothicUltraLight.ttf) format('truetype');
}

@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 300;
    src: local('Nanum Barun Gothic Light'), local('Nanum Barun Gothic-Light'), local('NanumBarunGothic Light');
    /*src: url(font/NanumBarunGothicLight.eot);
    src: url(font/NanumBarunGothicLight.eot?#iefix) format('embedded-opentype'),*/
    src: url(/resources/css/font/NanumBarunGothicLight.woff2) format('woff2'),
    url(/resources/css/font/NanumBarunGothicLight.woff) format('woff'),
    url(/resources/css/font/NanumBarunGothicLight.ttf) format('truetype');
}

@font-face {
    font-family: 'Nanum Barun Gothic';
    font-style: normal;
    font-weight: 400;
    src: local('Nanum Barun Gothic Regular'), local('Nanum Barun Gothic-Regular'), local('NanumBarunGothic Regular');
    /* src: url(font/NanumBarunGothic.eot);
     src: url(font/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),*/
    src: url(/resources/css/font/NanumBarunGothic.woff2) format('woff2'),
    url(/resources/css/font/NanumBarunGothic.woff) format('woff'),
    url(/resources/css/font/NanumBarunGothic.ttf) format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-weight: 100;
    src:url(/resources/css/font/NotoSansJP-Thin.woff2) format('woff2'),
    url(/resources/css/font/NotoSansJP-Thin.woff) format('woff');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-weight: 300;
    src:url(/resources/css/font/NotoSansJP-Regular.woff2) format('woff2'),
    url(/resources/css/font/NotoSansJP-Regular.woff) format('woff');
}

/* Common */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,table,th,td,form,fieldset,legend,textarea,input,select,textarea,button,article,aside,dialog,footer,header,section,footer,nav,figure,main{margin:0;padding:0}
article,aside,dialog,footer,header,section,footer,nav,figure,main{display:block}
html,body{height:100%}
body{-webkit-text-size-adjust:none}
body,input,textarea,select,button,table{font-family: '나눔바른고딕',Nanum Barun Gothic,'nb',sans-serif;color:#333333;}
body:lang(ja),input:lang(ja),textarea:lang(ja),select:lang(ja),button:lang(ja),table:lang(ja){font-weight:300; font-family:'Noto Sans JP',“ヒラギノ角ゴ Pro W3”, “Hiragino Kaku Gothic Pro”,Osaka, “メイリオ”, Meiryo, “ＭＳ Ｐゴシック”, “MS PGothic”, sans-serif!important}
fieldset,li,img{border:0;vertical-align:top}
ul,ol{list-style:none}
button{overflow:visible;border:0;background-color:transparent;cursor:pointer;outline:none}
button::-moz-focus-inner{padding:0;border:0}
address,caption,em{font-style:normal}
a{color:#000;text-decoration:none;cursor:pointer;}
a:hover,a:active,a:focus{text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
input[type=text],input[type=number],input[type=radio],input[type=checkbox],input[type=search],textarea,button{border:0 none;border-radius:0;-webkit-appearance:none;appearance:none;-webkit-text-size-adjust:none;-webkit-border-radius:0}
img{width:100%;}

/* Showcase Mobile */
.main_info {background-color:#232730; text-align:center;}
.main_info h2 {color:#ffffff; font-size:8.0vw; padding-top:16vw;}
.main_info p {color:#ffffff; font-size:3.6vw; padding-top:6.5vw; line-height:6vw;}
.main_info img {width:52.7vw; padding-top:8vw; padding-bottom:11vw;}

.main_sub_info {text-align:center; border-bottom:1px solid #d5d5d5;}

.doorlock_swipe_wrap {background-color:#ffffff;}
.doorlock_swipe_wrap .content_desc {margin-top:7.3vw;}
.doorlock_swipe_wrap .content_desc img {width:10.6vw;}
.doorlock_swipe_wrap .content_desc span {display:inline-block; text-align:left; width:68vw; line-height:6vw; color:#555555; font-size:3.6vw; margin-left:3.6vw;}
.doorlock_swipe_wrap .content_desc span:lang(ja) {width:71vw;}
.swiper_indicator {margin:3.7vw auto 4.2vw; width:12.8vw; height:4.2vw; font-size:3vw; padding-top:1.2vw; text-align:center; border-radius:12.8vw; color:#ffffff; background-color:rgba(0,0,0,0.4);}
.swiper_indicator:lang(ja) {padding-top:0.6vw; height:4.8vw;}

.market_ex .tit_sect {text-align:center;}
.market_ex .tit_sect h2 {font-size:7vw; color:#333333; padding-top:16vw;}
.market_ex .tit_sect .market_list {padding-top:7.4vw; border-bottom:1px solid #d5d5d5;}
.market_ex .tit_sect .market_list li {display:inline-block; width:21.4vw; height:25.4vw;}
.market_ex .tit_sect .market_list li img {width:14vw;}
.market_ex .tit_sect .market_list li p {color:#333333; font-size:3.4vw; margin-top:3vw; margin-bottom:6vw;}
.market_ex .tit_sect .market_list li.select {border-bottom:2px solid #4b96e6;}
.market_ex .tit_sect .market_list li.select p {color:#4b96e6;}

.market_ex .market_cont {background-color:#fafafa; padding:9vw 8vw 6vw 8vw; line-height:6vw;}
.market_ex .market_cont .shop_tit {font-size:6vw; color:#333333;}
.market_ex .market_cont .shop_sub_tit {font-size:3.6vw; color:#555555; padding-top:3vw;}
.market_ex .market_cont .req_tit {font-size:4vw; color:#333333; padding-top:6vw;}
.market_ex .market_cont .req_list {padding-top:3vw; padding-bottom:5vw;}
.market_ex .market_cont .req_item {padding-bottom:1vw;}
.market_ex .market_cont .dot {display:inline-block; width:0.5vw; height:0.5vw; float:left; border-radius:1vw; background-color:#999999; margin-top:2.5vw; margin-right:2.0vw;}
.market_ex .market_cont .txt {display:inline-block; width:80vw; font-size:3.6vw; color:#555555;}
.market_ex .market_cont .propose_tit {font-size:4vw; color:#333333;}
.market_ex .market_cont .propose_sub_tit {font-size:3.6vw; color:#4b96e6; padding-top:2vw; padding-top:2.2vw;}
.market_ex .market_cont .propose_list {padding-top:3vw;}
.market_ex .market_cont .propose_item {padding-bottom:1vw;}

.img_wrap {position:relative;}
.img_wrap .content_img {widht:100vw; height:61.3vw;}
.img_wrap .btn {position:absolute; width:10vw; height:10vw; top:26vw; background:url(img/doorlock-m-franchise-photo-pre-nor.png) no-repeat; background-size:contain;}
.img_wrap .btn:hover {background:url(img/doorlock-m-franchise-photo-pre-pressed.png) no-repeat; background-size:contain;}
.img_wrap .btn.prev {left:5vw;}
.img_wrap .btn.next {right:5vw; transform: rotate(180deg);}
.img_wrap .pointer_wrap {position:absolute; width:100%; bottom:5vw; text-align:center;}
.img_wrap .pointer_wrap li {display:inline-block; width:2vw; height:2vw; border:1px solid #ffffff; border-radius:10vw; margin-right:2vw; cursor:pointer;}
.img_wrap .pointer_wrap li.on {background-color:#ffffff;}

.cs_query {padding:9vw 8vw 6vw 8vw;}
.cs_query .query_tit {font-size:6vw; line-height:8vw; color:#333333;}
.cs_query .query_desc {font-size:3.6vw; color:#555555; margin-top:2vw; line-height:6vw;}
.cs_query .query_link {font-size:3.6vw; color:#4b96e6; margin-top:4vw; margin-bottom:4vw; display:inline-block; width:auto;}
.cs_query .query_link span {display:inline-block; margin-left:1vw; margin-bottom:-0.8vw; width:4vw; height:4vw; background:url(img/common-m-btn-arrow-blue.png) no-repeat; background-size:contain;}

#footer_m {position:relative;width:100%;height:35vw;margin:0;padding:0;background:#262626;}
#footer_m a {color:#777777; font-size:2.5vw;}
#footer_m .inr_m{overflow:hidden;padding:0;text-align:center}
#footer_m .inr_m .f_m_logo{display:inline-block;width:100vw; vertical-align:top; text-align:center;}
#footer_m .inr_m .f_m_info{position:relative;margin-top:8vw;line-height:2vw;}
#footer_m .inr_m .copy{display:block;margin-top:3vw; margin-bottom:4vw;font-size: 3vw;font-weight:lighter;color:#555555;text-align:center;}
#footer_m .lst_m_footer{display:inline-block;vertical-align:top}
#footer_m .lst_m_footer li{float:left;position:relative;font-size:6vw;color:#777;margin-right:3vw;}
#footer_m .lst_m_footer li:first-child:after{background:none}
#footer_m .lst_m_footer li:lang(ja){font-size:3vw; margin-right:1vw;}
#footer_m.lst_m_footer li a{display:block;padding: 0 4px;font-size: 3.2vw;color:#777;}
#footer_m #logo_img {width:18vw;}

.top_btn {
    position:fixed; width:12vw; right:4vw; bottom:4vw; z-index:99999999999;
}



