@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
/*
v1.0 2018-8
Juita Web Design バリ島ウェブ制作
https://juita.net
Theme for：ファクタリングコンシェルジュ
******************************/

/* ----------------------------------------------
Reset
---------------------------------------------- */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

/*default
*********************/
html,
body {margin: 0px;margin-bottom: 0px;margin-right: auto;margin-left: auto;font-size: 14px;
font-family: Noto Sans Japanese,Noto Sans JP,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", arial, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
line-height: 22px;-webkit-font-smoothing: antialiased;letter-spacing: 1px; background: #FFF;}
article,aside,details,figcaption,figure,footer,header,hgroup,
menu,nav,section {display: block;margin: 0px;padding: 0px;}
p,td,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4 {margin: 0px;padding: 0px;list-style: none;}
img {border: 0px; font-size: 0; line-height: 0;vertical-align:bottom; max-width: 100%;transition: 0.5s;}

/*for all
*********************/
.mincho{font-family: "Sawarabi Mincho","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
a,img {transition: 0.5s;text-decoration: none; color: #333333;}
a:hover{color: #999;}
a:hover img {opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";}
.wmain{width: 1200px; margin: 0 auto; overflow: hidden;}
.left{float: left}
.right{float: right;}
.pc{display: inline-block;}
.sp{display: none;}
.center{text-align: center;}
h2{text-align: center;}

/*header
*********************/
.header{overflow: hidden;margin: 0 auto 1px;-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);}
.header .wmain{padding: 0 0 10px;}
.header .hti {padding: 3px 0 0px;border-top: 6px solid #ff228a;}
.header .hti h1{ width: 1200px;margin: 0 auto;  font-weight: normal; font-size: 14px;}
.header .logo{margin: 15px 0 0;}
.header .head-cta{overflow: hidden; position: relative;}
.header ul{text-align: right; overflow: hidden;}
.header .head-cta ul li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 0 2px;}

/*nav
*********************/
.nvcontainer{display: none;}
.nav{overflow: hidden;width: 100%;}
.nav ul{width: 100%; text-align: center;padding:0; font-weight: bold; margin: 15px 0 0px; position: relative;}
.nav ul:before{content: url(../img/nav-ln.png); position: absolute; left: 0; top: 2px;}
/*.nav ul li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; padding: 0 42px;position: relative;} edit 2018.8.24*/
.nav ul li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; padding: 0 22px;position: relative;}
.nav ul li:after{content: url(../img/nav-ln.png); position: absolute; right: 0; top: 2px;}

/*top page
*********************/
.mainvis{overflow: hidden;background: url(../img/topbg.jpg) center 0 no-repeat; background-size: cover;}

.desc{overflow: hidden; text-align: center; color:#333333;}
.desc h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.desc h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.desc p{font-size:26px; line-height: 2em; margin: 60px 0; }

.merit{overflow: hidden;background: url(../img/merit-ar.png) center 0 no-repeat #fff9fc; background-size: contain; padding: 40px 0;}
.merit h2{color: #ff228a; font-size: 48px; ; font-weight: 500;line-height: 1.4em;}
.merit .sub{text-align: center;}
.merit ul{overflow: hidden;margin: 30px auto 0; width: 90%;}
.merit ul li{overflow: hidden; font-size: 30px; color: #222222; line-height: 2em; margin: 0 0 10px; height:180px;}
.merit ul li .img{float: left; width: 20%; text-align: center;}
.merit ul li .ti{float: right; width: 75%; padding: 23px 0 0; line-height: 1.4em;}
.merit_txt{font-size:16px;float: right; width: 75%; padding: 23px 0 0; line-height: 1.5em;}
.reason{overflow: hidden; padding: 0 0 40px;}
.reason h2{background: #ff228a; color: #fff;font-size: 36px; line-height: 1.4em;; font-weight: 500;
padding: 20px 0; position: relative}
.reason h2:after{content: url(../img/pnk-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center; font-size: 36px; line-height: 1.4em;}
.reason h2 span{font-size: 130%;}
.reason ul{margin: 55px 0 0; text-align: center; overflow: hidden;}
.reason ul li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 0 5px; width: 18%;}
.reason .ti{color: #ff228a; font-weight: bold; font-size: 20px; margin: 15px 0 10px; text-align: center; line-height: 1.4em;}
.reason p{text-align: left;}
.reason .ti:after{content: url(../img/reason-ln.png);}

.voice{padding:0 0 40px; overflow: hidden;}
.voice h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 25px 0; position: relative;}
.voice ul{text-align: center; overflow: hidden; margin: 40px 0 25px;}
.voice li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 10px; width: 25%; background: #fff;
border:1px solid #e0e0e0; padding:25px; border-radius:6px;-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.17);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.17);box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.17);
min-height: 156px;}
.voice li .img{width: 20%; margin: 0 auto 20px;}
.voice li .ti{font-size: 18px; font-weight: bold; color: #0098f2; line-height: 1.4em;}
.voice .btn{text-align: center;}

/*voice page
*********************/
.pvoice{overflow: hidden;}
.pvoice .top{padding: 80px 0; background: url(../img/top-voice.jpg) center 0 no-repeat; background-size: cover; text-align: center;}
.pvoice .top .ti{font-size: 48px; color: #ff228a; font-weight: bold; line-height: 1em;text-shadow:0px 2px 2px #ffffff;
letter-spacing: 0;}
.pvoice .top .ti small{font-weight: normal; font-size: 14px; color: #111;display: block;}
.pvoice h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.pvoice h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.pvoice ul{width: 80%; margin: 70px auto 30px; overflow: hidden;}
.pvoice ul li{overflow: hidden; margin: 0 0 30px;}
.pvoice ul li .img{width: 18%; text-align: center;}
.pvoice ul li .txt{width: 77%;position: relative;}
.pvoice ul li .txt:before{position: absolute;content: url(../img/voice-ar.png); top: 50px; left: -32px;}
.pvoice ul li .txt .ctn{padding: 20px;background: #eff9ff; border-radius: 4px;}
.pvoice ul li .txt .ti{font-size: 18px; color: #2bb6ff; margin: 0 0 5px;}
.pvoice ul li .txt .ti-sub{font-size: 22px; line-height: 1.4em; color: #ff228a; margin: 0 0 10px;}

/*feature page
*********************/
.feature{overflow: hidden;}
.feature .top{padding: 42px 0; background: url(../img/top-flowfaq.jpg) center 0 no-repeat; background-size: cover; text-align: center;}
.feature .top .ti{font-size: 48px; color: #ff228a; font-weight: bold; line-height: 1.2em;text-shadow:0px 2px 2px #ffffff;
letter-spacing: 0;}
.feature .top .ti small{font-weight: normal; font-size: 14px; color: #111;display: block;}
.feature ul{text-align: center; overflow: hidden; margin: 40px 0 0; font-size: 0;}
.feature ul li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 0 10px 10px; width:178px;}
.feature h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.feature h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.feature .sub{text-align: center; margin: 100px 0 80px; font-size: 24px; line-height: 1.4em;}
.feature .sub a{text-decoration: underline;}

/*flow faq page
*********************/
.flowfaq{overflow: hidden;}
.flowfaq .top{padding: 42px 0; background: url(../img/top-flowfaq.jpg) center 0 no-repeat; background-size: cover; text-align: center;}
.flowfaq .top .ti{font-size: 48px; color: #ff228a; font-weight: bold; line-height: 1.2em;text-shadow:0px 2px 2px #ffffff;
letter-spacing: 0;}
.flowfaq .top .ti small{font-weight: normal; font-size: 14px; color: #111;display: block;}
.flowfaq h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.flowfaq h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.flowfaq ul.flow{overflow: hidden; margin: 120px 0 100px; text-align: center;}
.flowfaq ul.flow li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 0 28px; width: 20%;position: relative;}
.flowfaq ul.flow li .img{padding: 40px 0; background: #f8f8f8}
.flowfaq ul.flow li .stp{margin: 15px 0;background: #ff228a; padding: 10px 0; color: #fff; border-radius: 100px;
font-size: 18px; font-weight: bold;}
.flowfaq ul.flow li .ti{font-size: 22px;}
.flowfaq ul.flow li:after{position: absolute;top: 25%;right: -50px; content: url(../img/flow-ar.png);}
.flowfaq ul.flow li:last-child:after{display: none;}

.flowfaq ul.qa{overflow: hidden; margin: 80px auto 20px; width: 65%;}
.flowfaq ul.qa li{overflow: hidden; margin: 0 0 50px;}
.flowfaq ul.qa li p{line-height: 1.4em;;}
.flowfaq ul.qa li .q{font-size: 22px;background: url(../img/qa-q.png) 0 10px no-repeat; padding: 13px 0 13px 60px;}
.flowfaq ul.qa li .a{font-size: 16px;background: url(../img/qa-a.png) 0 2px no-repeat; padding: 10px 0 10px 60px;}

/*company & privacy page
*********************/
.company{overflow: hidden;}
.company .top{padding: 42px 0; background: url(../img/top-company.jpg) center 0 no-repeat; background-size: cover; text-align: center;}
.company .top .ti{font-size: 48px; color: #ff228a; font-weight: bold; line-height: 1.2em;text-shadow:0px 2px 2px #ffffff;
letter-spacing: 0;}
.company .top .ti small{font-weight: normal; font-size: 14px; color: #111;display: block;}
.company h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.company h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.company .privacy{width: 70%;margin: 80px auto 0; color: #555; letter-spacing: 0;}
.company .privacy li{padding: 0 0 15px; margin: 0 0 25px; border-bottom: 1px solid #ddd;}
.company .privacy li:last-child{border:none;}
.company .privacy p{margin: 0 0 15px;}
.company .privacy .ti{font-size: 20px; line-height: 1.4em; margin: 0 0 10px; color: #111;}
.company .privacy .sub{font-size: 16px; color: #111;}
.company .cpdtl{margin: 60px auto; overflow: hidden; width: 80%;}
.company .map{width: 65%;}
.company .cpydtl{width: 30%; text-align: center; margin: 0 auto;}
.company .cpydtl li{margin: 0 0 15px;}
.company .cpydtl .ti{margin: 0 0 5px; padding: 0 0 5px; color: #ff228a; border-bottom: 1px solid #ddd;}
.company .gmap{position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;}
.company .gmap iframe,
.company .gmap object,
.company .gmap embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/*form
*********************/
.form{overflow: hidden;}
.form .top{padding: 42px 0; background: url(../img/top-form.jpg) center 0 no-repeat; background-size: contain; text-align: center;}
.form .top .ti{font-size: 48px; color: #ff228a; font-weight: bold; line-height: 1.2em;text-shadow:0px 2px 2px #ffffff;
letter-spacing: 0;}
.form .top .ti small{font-weight: normal; font-size: 14px; color: #111;display: block;}
.form h2{background: url(../img/rainbow-sep.png) center 0 no-repeat; background-size: cover;
color: #fff; font-weight: 500; font-size: 36px; line-height: 1.4em; padding: 30px 0; position: relative;}
.form h2:after{content: url(../img/rainbow-ar.png);position: absolute; left: 0; right: 0; bottom: -32px;
width: 100%; text-align: center;}
.form .sub{text-align: center;font-size: 22px; margin: 60px 0 40px; line-height: 1.8em; font-weight: bold;}
.form .mailform {background: #FFF;padding: 25px 35px; color: #222; width: 75%; margin: 15px auto 80px;}
#formWrap{text-align: center; margin: 60px 0 100px;}
.form table {text-align: left;width: 100%;border-collapse: collapse;border-spacing: 0; margin: 0 0 20px}
.form table th, .form table td {padding: 5px 0 10px;vertical-align: middle;}
.form table th {font-weight: normal;font-size: 15px;text-align: left;width: 35%;position: relative;}
.form table td {width: 65%;}
.form .form-text, .form .form-textarea {width: 100%;height: 40px;border: 1px solid #D6D6D6;background: #f8f8f8;
padding: 3px;box-sizing: border-box;-webkit-appearance: none;border-radius: 4px;font-size: 14px;}
.form .form-textarea {height: 120px;}
input[type="submit"], input[type="button"] {cursor: pointer;}
.form table th:before {content: '';position: absolute;right: 30px;top: 0;
bottom: 0;margin: auto 0;width: 43px;height: 28px;}
.form table th.hissu:before {background: url(../img/form-hissu.png) no-repeat;}
.form table th.nini:before {background: url(../img/form-nini.png) no-repeat;}

.form input[type=radio]{display: inline-block;margin-right: 6px;}
.form input[type=radio] + label{position: relative;display: inline-block;
margin-right: 20px;font-size: 14px;line-height: 30px;cursor: pointer;}
.form input[type=radio]{display: none;margin: 0;}
.form input[type=radio] + label{padding: 0 0 0 24px;}
.form input[type=radio] + label::before{content: "";
position: absolute;top: 50%;left: 0;-moz-box-sizing: border-box;box-sizing: border-box;
display: block;width: 18px;height: 18px;margin-top: -9px;background: #FFF;}
.form input[type=radio] + label::before {border: 1px solid #999;border-radius: 30px;}
.form input[type=radio]:checked + label::after{
content: "";position: absolute;top: 50%;-moz-box-sizing: border-box;
box-sizing: border-box;display: block;left: 5px;width: 8px;
height: 8px;margin-top: -4px;background: #ff228a;border-radius: 8px;}
.form input[type=radio]:checked + label{color:#ff228a; font-weight: bold;}
.form input[type=radio]:checked  + label::before {border: 1px solid #ff228a;}
input::placeholder{color: #bbb;}
.confirm table th,.confirm table td {border-bottom: 1px dotted #CCC;padding: 10px 15px;}
.confirm table th{color: #777;}
.form-btn-conf {background: url(../img/form-confirm.png) center no-repeat; background-size: contain;}
.form-btn-back {background: url(../img/form-back.png) center no-repeat; background-size: contain;}
.form-btn-send {background: url(../img/form-send.png) center no-repeat; background-size: contain;}
.form-btn {width: 334px;height: 59px;text-align: center;line-height: 50px;border: none;
border-radius: 5px;-webkit-appearance: none;text-indent: -999px;}
.form-btn:hover{opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";transition: 0.5s;}
.mail-btn li {display: inline-block; *display: inline; *zoom: 1; vertical-align: top;}

.form .footer p{font-weight:normal;}
.form .footer p span{font-weight:bold;}
.copyright{text-align: center; padding: 15px; font-size:12px;}

.form .formBx,.form .thx {padding: 50px;text-align: center;font-size: 16px;line-height: 2em; margin: 0; color: #000;}
.form .thx p{ color: #222;font-weight:normal;}
.form .btn-tosite {background-color: #555;border: none;color: white;padding: 10px 25px;
text-align: center;text-decoration: none;display: inline-block;font-size: 14px;margin: 50px 2px 0;
cursor: pointer;border-radius: 4px;font-weight: bold;}
.form select {display: inline-block;min-width: 100%;padding: 0.8em 0 0.8em 5px;border: #dadada 1px solid;border-radius: 3px;line-height: 1.4em;background: #f8f8f8;}

.form.thx{background:none; border-top: 1px solid #eee;}
.form.cfm{background:none; border-top: 1px solid #eee;}
.error,.error_messe{color: red;}
.form .formwrap{margin: 50px 0;}
.form.confirm{text-align: center;}
.form table.formTable-confirm{margin:30px auto;width: 65%;}

/*cta
*********************/
.cta{padding: 40px 0; width: 1125px; margin: 60px auto; border:6px solid #eeeeee;background: url(../img/cta-bg.jpg) center 0 no-repeat;
background-size: cover; position: relative; text-align: center;}
.cta h3{color: #ff228a; font-size: 36px; font-weight: bold; line-height: 1.3em; position: relative; z-index: 2;}
.cta h3 span{color: #111; font-size: 85%;}
.cta .sub{position: relative;z-index: 2;}
.cta .ti{font-size: 36px; font-weight: bold; line-height: 1.4em;}
.cta .btn{margin: 15px 0 0;}
.cta .cta-mdl{position: absolute; right: 0; bottom: 0;}

/*footer
*********************/
.footer{overflow: hidden;border-top: 1px solid #ddd; text-align: center;}
.footer .cmpy{padding: 40px 0; margin: 10px 0 0; background: #f4f4f4;}
.footer h3 a{color: #ff228a; font-weight: bold; font-size: 22px; line-height: 1.4em; position: relative;
margin: 0 0 30px;}
.footer h3{position: relative;line-height: 1.8em;padding: 0 0 10px;margin: 0 0 10px;}
.footer h3:after{position: absolute; height: 2px; width: 80px; left: 0; right: 0; background:#ff228a; content: "";
bottom: 0px;margin: 0 auto;}
.footer .copyright{padding: 13px 0; font-size: 12px;}
.footer .gotop{position: fixed; bottom: 3px; right: 8px; z-index: 5;}

/*popup form
*********************/
.popup_form{width: 370px; border:1px solid #ddd; position: fixed; bottom: 0; z-index: 999; border-radius: 6px 6px 0 0;
background: #fff; right: 65px;-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);}
.popup_form #form-btn{background: #ff228a;color: #fff; font-weight: bold; font-size: 20px;
position: relative; border-radius: 6px 6px 0 0; cursor: pointer; line-height: 1.2em;}
.popup_form #form-btn:after{content: url(../img/form-open.png);position: absolute; right: 15px; top: 13px;}
.popup_form #form-btn.active:after{content: url(../img/form-close.png);}
.popup_form ul{padding: 10px;overflow-y: auto; max-height: 300px;}
.popup_form ul li{margin: 0 0 12px;}
.popup_form .form-text,.popup_form .form-textarea{width: 100%;height: 35px;border: 1px solid #D6D6D6;padding: 3px;box-sizing: border-box;
-webkit-appearance: none;border-radius: 4px;font-size: 13px; background: #f5f5f5;}
.popup_form .form-textarea{height: 120px;}
.popup_form .hissu:after{content: "必須"; color: #e31c41; font-size: 11px; margin: 0 0 0 5px;}
.popup_form input[type=radio] {background: #fff;padding: 3px;border: none;width: 17px;height: 17px;
vertical-align: top; margin: 3px 3px 0 0;}
.popup_form label:after {margin: 0 15px 0 0;content: "";}
.popup_form select {display: inline-block;min-width: 100%;padding: 0.8em 0 0.8em 5px;border: #dadada 1px solid;
border-radius: 3px;line-height: 1.4em;background: #f5f5f5;font-size: 15px;}
.popup_form .form-cfm{text-align: center; padding:8px 0 2px;background: #efefef; border-top: 1px solid #ddd;}
/*.popup_form .form-cfm:hover{opacity: 0.7;filter: alpha(opacity=70);-ms-filter: "alpha(opacity=70)";}*/
.popup_form label.error{background: #ffcedc; color:#ff0000; font-size: 11px; width: 100%; display: block;}
::-webkit-scrollbar {width: 5px;}
::-webkit-scrollbar-track {border-radius: 10px;box-shadow: inset 0 0 5px rgba(0, 0, 0, .1);}
::-webkit-scrollbar-thumb {background-color:#ccc;box-shadow:0 0 0 1px rgba(255, 255, 255, .3);}

.popup_form #form-btn #clk{position: relative;overflow: hidden;padding: 20px 10px;}
.popup_form #form-btn .puchi{position: absolute; top: -85px; right: 10px;}
.popup_form #form-btn.active .puchi{display: none;}
.popup_form #form-btn.active .reflection{display: none;}

.form-btn-pop {background: url(../img/form-btn.png) center no-repeat; background-size: contain;}
.form-btn-popup {width: 229px;height: 47px;text-align: center;line-height: 50px;border: none;
border-radius: 5px;-webkit-appearance: none;text-indent: -999px;}

select.ok{background: #e1ffcf;border: 1px solid #48954d;font-weight: bold;}


.reflection {
    height      :100%;
    width       :30px;
    position    :absolute;
    top         :-180px;
    left        :0;
    background-color: #fff;
    opacity     :0;
    transform: rotate(45deg);
    animation: reflection 3s ease-in-out infinite;
    -webkit-transform: rotate(45deg);
    -webkit-animation: reflection 3s ease-in-out infinite;
    -moz-transform: rotate(45deg);
    -moz-animation: reflection 3s ease-in-out infinite;
    -ms-transform: rotate(45deg);
    -ms-animation: reflection 3s ease-in-out infinite;
    -o-transform: rotate(45deg);
    -o-animation: reflection 3s ease-in-out infinite;
}
 
@keyframes reflection {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { transform: scale(4) rotate(45deg); opacity: 1; }
    100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
    0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
    0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
    0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}

/*not found + breadcrumb
*********************/
.notfound{padding: 80px 0; text-align: center; min-height: 310px;}
.notfound h2{margin: 0 0 40px;}

.breadcrumb{padding: 3px; font-size: 12px;background: #f9f9f9;}
.breadcrumb li{display: inline-block;*zoom: 1;*display: inline; vertical-align: top; margin: 0 2px;}
.breadcrumb li.current{color: #aaa;}