@charset "UTF-8";
/* Reset Stylesheet Based on - html5doctor.com Reset Stylesheet http://html5doctor.com/html-5-reset-stylesheet/ */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, movie { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
body { line-height: 1; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
table { border-collapse: collapse; border-spacing: 0; }
input, select { vertical-align: middle; }
ul, li { list-style: none; }


/*-------------------------------------
clearfix
-------------------------------------*/
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/*-------------------------------------
basic
-------------------------------------*/
body { font: 75%/1.5 "Oswald", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif; font-weight: 300; color: rgb(40,40,40); -webkit-text-size-adjust: 100%; }
a { text-decoration: none; cursor: pointer; outline: none; color: rgb(0,100,210); }
a:hover { text-decoration: underline; }
a:focus { outline: none; }
a:hover img { opacity: 0.8; transition: all 0.2s ease 0s; backface-visibility: hidden; }
h1, h2, h3, h4 { font-weight: 300; }
img { vertical-align: bottom; }
img { backface-visibility: hidden; }
.inner { width: 1140px; margin: 0px auto; }
.none { display: none; }
.mt0 { margin-top: 0 !important; }
.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mb0 { margin-bottom: 0 !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }


/*-------------------------------------
header
-------------------------------------*/
header { width: 100%; min-width: 1140px; }
header .gb-site { background: rgb(0,0,0); }
header .gb-site .area { float: left; }
header .gb-site .area li { display: inline-block; margin: 8px 8px 8px 0px; color: rgb(80,80,80); }
header .gb-site .area li a { display: block; color: rgb(255,255,255); }
header .gb-site .member { float: right; }
header .gb-site .member li { float: left; }
header .gb-site .member li a { display: block; padding: 8px 0; color: rgb(255,255,255); margin-left: 20px; }
header .gb-site .member li.login { }
header .gb-site .member li.register { }
header .gb-head { background: rgb(230,0,0); }
header .gb-head h1 { padding: 8px 0px; color: rgb(255,255,255); }
header .gb-cont { display: block; }
header .gb-cont .logo { float: left; width: 218px; margin: 27px 0 28px; }
header .gb-cont .data { float: left; width: 168px; padding: 4px; margin: 16px 0px 16px 20px; background: rgb(255,200,0); border-radius: 4px; }
header .gb-cont .data-left { float: left; width: 58px; }
header .gb-cont .data-left p { font-size: 16px; font-weight: 700; }
header .gb-cont .data-left p span { float: left; padding: 0 5px; margin: 1px; color: rgb(255,255,255); background: rgb(230,0,0); border-radius: 4px; }
header .gb-cont .data-right { float: right; width: 108px; }
header .gb-cont .data-right ul { background: rgb(255,255,255); border-radius: 0 4px 4px 0; margin: 1px; }
header .gb-cont .data-right li { padding: 6px 6px; border-top: solid 1px rgb(255,200,0); line-height: 100%; }
header .gb-cont .data-right li:first-child { border-top: none; }
header .gb-cont .data-right .count { color: rgb(230,0,0); font-size: 15px; font-weight: 700; padding: 0 4px; }
header .gb-cont .search { float: left; width: 300px; margin: 16px 0 18px 40px; }
header .gb-cont .search .search-tab { width: 300px; }
header .gb-cont .search .shop { float: left; padding: 2px 12px; border-top: solid 1px rgb(230,0,0); border-left: solid 1px rgb(230,0,0); border-radius: 4px 0 0 0; }
header .gb-cont .search .girl { float: left; padding: 2px 12px; border-top: solid 1px rgb(230,0,0); border-left: solid 1px rgb(230,0,0); border-right: solid 1px rgb(230,0,0); }
header .gb-cont .search .word { float: left; padding: 2px 12px; border-top: solid 1px rgb(230,0,0); border-right: solid 1px rgb(230,0,0); border-radius: 0 4px 0 0; }
header .gb-cont .search .selected { color: rgb(255,255,255); background: rgb(230,0,0); }
header .gb-cont .search form { float: left; }
header .gb-cont .search input { float: left; width: 260px; height: 35px; padding: 4px 6px 4px 16px; line-height: 38px; font-size: 12px; border: solid 2px rgb(230,0,0); border-radius: 0 0 0 4px; box-sizing: border-box; }
header .gb-cont .search button { float: left; width: 40px; height: 35px; padding: 2px 0; text-align: center; line-height: 38px; font-size: 14px; color: rgb(255,255,255); background: rgb(230,0,0); cursor: pointer; border: medium none; border-radius: 0 4px 4px 0; box-sizing: border-box; }
header .gb-cont .search button .icon { font-weight: 300; font-size: 22px; }
header .gb-cont .ad { float: right; width: 310px; margin: 6px 0; }
header .gb-cont .ad img { float: right; width: 310px; }
header .gb-nav { border-top: 1px solid rgb(235,235,235); border-bottom: 1px solid rgb(235,235,235); }
header .gb-nav ul { display: block; border-left: 1px solid rgb(235,235,235); box-sizing: border-box; }
header .gb-nav li { float: left; text-align: center; font-size: 14px; font-weight: 700; border-right: 1px solid rgb(235,235,235); box-sizing: border-box; }
header .gb-nav li a { display: block; padding: 16px 0; color: rgb(50,50,50); }
header .gb-nav li a:hover { color: rgb(230,0,0); text-decoration: none; }
header .gb-nav .gn1 { width: 10%; }
header .gb-nav .gn2 { width: 11%; }
header .gb-nav .gn3 { width: 11%; }
header .gb-nav .gn4 { width: 10%; }
header .gb-nav .gn5 { width: 9%; }
header .gb-nav .gn6 { width: 11%; }
header .gb-nav .gn7 { width: 10%; }
header .gb-nav .gn8 { width: 9%; }
header .gb-nav .gn9 { width: 9%; }
header .gb-nav .gn10 { width: 10%; }


/*-------------------------------------
contents
-------------------------------------*/
.contents { width: 100%; min-width: 1140px; font-size: 13px; background: rgb(245,245,245); }
.contents .inner { padding: 30px 0; }
.block { display: block; position: relative; margin-bottom: 30px; }
.box { background: rgb(255,255,255); box-shadow: 0 0 2px rgb(230,230,230); position: relative; }


/*-------------------------------------
head
-------------------------------------*/
.head { padding: 40px 20px 10px; background: rgb(255,255,255); box-shadow: 0 0 2px rgb(230,230,230); position: relative; }
.head .title { font-size: 26px; }
.head .notes { font-size: 11px; color: rgb(120,120,120); }


/*-------------------------------------
main
-------------------------------------*/
.main { width: 100%; margin-right: -258px; float: left; }
.main .block { margin-right: 280px; }


/*-------------------------------------
side
-------------------------------------*/
.side { width: 258px; float: right; }


/*-------------------------------------
footer
-------------------------------------*/
footer { width: 100%; min-width: 1140px; }
footer .pagetop { width: 100%; height: 58px; display: block; background: rgb(40,40,40); position: relative; overflow: hidden; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
footer .pagetop .arrow { width: 28px; height: 58px; margin: 0 auto; display: block; background: url(../images/pagetop.png) no-repeat; background-position: 0 20px; position: relative; z-index: 2; }
footer .pagetop:after { width: 100%; height: 58px; content: ""; position: absolute; left: 0; top: 58px; background: rgb(0,0,0); z-index: 1; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
footer .pagetop:hover:after { top: 0; }
.footer-copy { width: 100%; padding: 30px 0px; background: rgb(255,255,255); }
.footer-copy p { color: rgb(230,0,0); font-size: 12px; font-weight: bold; }
.footer-copy .logo { max-width: 218px; width: 24%; float: right; }
.footer-sitemap { width: 100%; padding: 50px 0px; background: rgb(230,0,0); }
.footer-sitemap ul { display: block; }
.footer-sitemap ul li { margin-right: 10px; display: inline-block; }
.footer-sitemap ul li a { color: rgb(255,255,255); }
footer .copyright { padding: 15px 0px; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); }


/*-------------------------------------
breadcrumbs
-------------------------------------*/
.breadcrumbs { position: absolute; top: 10px; left: 3px; z-index: 1; background-color: transparent; font-size: 11px; }
.breadcrumbs li { float: left; margin-right: 1.3em; }
.breadcrumbs li a { line-height: 1; height: 1em; display: inline-block; padding: .5em; position: relative; background-color: rgb(235,235,235); color: inherit; text-decoration: none; }
.breadcrumbs li a:before, .breadcrumbs li a:after { border: solid transparent; content: ''; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 1em; margin-top: -1em; top: 50%; }
.breadcrumbs li a:before { border-color: transparent; left: 100%; border-left-color: rgb(235,235,235); }
.breadcrumbs li a:after { border-color: rgb(235,235,235); right: 100%; border-left-color: transparent; border-right: none; }
.breadcrumbs li:first-child a { background-color: rgb(50,50,50); padding-left: 1em; color: rgb(255,255,255); margin-left: -1em; }
.breadcrumbs li:first-child a:before { border-left-color: rgb(50,50,50); }
.breadcrumbs li:first-child a:after { top: 100%; left: 0; border-color: transparent; right: auto; border-top-color: rgb(0,0,0); margin-top: 0; border-width: 0.7em; }
.breadcrumbs .selected { line-height: 1; height: 1em; display: inline-block; padding: .5em; position: relative; background-color: rgb(230,0,0); color: rgb(255,255,255); }
.breadcrumbs .selected:before, .breadcrumbs .selected:after { border: solid transparent; content: ''; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 1em; margin-top: -1em; top: 50%; }
.breadcrumbs .selected:before { border-color: transparent; left: 100%; border-left-color: rgb(230,0,0); }
.breadcrumbs .selected:after { border-color: rgb(230,0,0); right: 100%; border-left-color: transparent; border-right: none; }


/*-------------------------------------
title
-------------------------------------*/
/* title-a */
.title-a { margin-bottom: 20px; padding-bottom: 10px; font-size: 20px; font-weight: 700; line-height: 120%; border-bottom: 3px solid rgb(230,0,0); position: relative; }
.title-a .count { padding: 0 15px 1px 15px; margin-left: 5px; font-size: 18px; font-weight: 400; color: rgb(255,255,255); background: rgb(230,0,0); border-radius: 15px; position: absolute; top: 0; }
.title-a .read { display: block; font-size: 13px; font-weight: 300; color: rgb(0,0,0); }
.title-a .icon { float: left; width: 48px; margin-right: 10px; color: rgb(255,255,255); background: rgb(230,0,0); border-radius: 6px; font-weight: 300; text-align: center; }
.title-a .icon-area { font-size: 32px; height: 40px; padding-top: 8px; }
.title-a .icon-discount { font-size: 38px; height: 43px; padding-top: 5px; }
.title-a .icon-gallery { font-size: 28px; height: 38px; padding-top: 10px; }
.title-a .icon-guide { font-size: 30px; height: 40px; padding-top: 8px; }
.title-a .icon-heart-minus {}
.title-a .icon-heart-plus {}
.title-a .icon-heart { font-size: 32px; height: 40px; padding-top: 8px; }
.title-a .icon-history {}
.title-a .icon-mail {}
.title-a .icon-member { font-size: 32px; height: 40px; padding-top: 8px; }
.title-a .icon-new { font-size: 38px; height: 43px; padding-top: 5px; }
.title-a .icon-nice {}
.title-a .icon-open {}
.title-a .icon-price {}
.title-a .icon-profile { font-size: 38px; height: 43px; padding-top: 5px; }
.title-a .icon-ranking { font-size: 34px; height: 40px; padding-top: 8px; }
.title-a .icon-review { font-size: 32px; height: 40px; padding-top: 8px; }
.title-a .icon-schedule { font-size: 32px; height: 40px; padding-top: 8px; }
.title-a .icon-shop-minus {}
.title-a .icon-shop-plus {}
.title-a .icon-shop { font-size: 28px; height: 37px; padding-top: 11px; }
.title-a .icon-soap { font-size: 37px; height: 43px; padding-top: 5px; }
.title-a .icon-star-empty {}
.title-a .icon-star-full {}
.title-a .icon-star-half {}
.title-a .icon-tel {}
.title-a .icon-train {}
.title-a .icon-movie { font-size: 27px; height: 37px; padding-top: 11px; }
/* title-b */
.title-b { padding: 12px 15px; font-size: 18px; font-weight: 700; border-top: 3px solid rgb(230,0,0); border-bottom: 1px solid rgb(235,235,235); position: relative; }
.title-b .read { margin: 5px 0 0 10px; position: absolute; font-size: 12px; color: rgb(120,120,120); font-weight: 300; }
.title-b .icon { float: left; margin-left: -3px; margin-right: 8px; color: rgb(230,0,0); font-weight: 300; }
.title-b .icon-area {}
.title-b .icon-discount { font-size: 36px; margin-top: -5px; }
.title-b .icon-guide {}
.title-b .icon-heart-minus {}
.title-b .icon-heart-plus {}
.title-b .icon-history { font-size: 28px; margin-top: -1px; }
.title-b .icon-mail { font-size: 24px; margin-top: 1px; }
.title-b .icon-member {}
.title-b .icon-new { font-size: 36px; margin-top: -4px; }
.title-b .icon-nice {}
.title-b .icon-open {}
.title-b .icon-price { font-size: 32px; margin-top: -3px; }
.title-b .icon-profile {}
.title-b .icon-shop-minus {}
.title-b .icon-shop-plus {}
.title-b .icon-shop { font-size: 26px; margin-top: 1px; }
.title-b .icon-star-empty {}
.title-b .icon-star-full {}
.title-b .icon-star-half {}
.title-b .icon-tel {}
.title-b .icon-train {}
.title-b .icon-movie {}


/*-------------------------------------
more
-------------------------------------*/
/* more-a */
.more-a { position: absolute; right: 0px; top: 12px; }
.more-a a { display: block; padding: 3px 10px 5px 20px; color: rgb(230,0,0); background: rgb(255,255,255); border: 1px solid rgb(230,0,0); border-radius: 4px; }
.more-a a:hover { color: rgb(255,255,255); background: rgb(230,0,0); text-decoration: none; }
.more-a a:before { content: ''; position: absolute; top: 50%; left: 0; width: 0; height: 0; margin-left: 10px; margin-top: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid transparent; border-left: 6px solid rgb(230,0,0); }
.more-a a:hover:before { border-left: 6px solid rgb(255,255,255); }
/* more-b */
.more-b { position: absolute; right: 12px; top: 13px; }
.more-b a { display: block; padding: 3px 10px 5px 20px; color: rgb(230,0,0); background: rgb(255,255,255); border: 1px solid rgb(230,0,0); border-radius: 4px; }
.more-b a:hover { color: rgb(255,255,255); background: rgb(230,0,0); text-decoration: none; }
.more-b a:before { content: ''; position: absolute; top: 50%; left: 0; width: 0; height: 0; margin-left: 10px; margin-top: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid transparent; border-left: 6px solid rgb(230,0,0); }
.more-b a:hover:before { border-left: 6px solid rgb(255,255,255); }


/*-------------------------------------
sort
-------------------------------------*/
.sort { display: block; margin-bottom: 30px; }
/* sort-a */
.sort-a { border: 1px solid rgb(230,0,0); border-radius: 4px; }
.sort-a li { float: left; text-align: center; background: rgb(255,255,255); border-left: 1px solid rgb(230,0,0); box-sizing: border-box; }
.sort-a li:first-child { border-left: none; }
.sort-a li:first-child { border-radius: 3px 0 0 3px; }
.sort-a li:last-child { border-radius: 0 3px 3px 0; }
.sort-a li a { display: block; padding: 15px 0px; color: rgb(40,40,40); }
.sort-a li a:hover { color: rgb(230,0,0); text-decoration: none; }
.sort-a .selected { display: block; padding: 15px 0px; color: rgb(255,255,255); background-color: rgb(230,0,0); }
.sort-a .saturday a { color: rgb(0,160,230); }
.sort-a .sunday a { color: rgb(230,0,0); }
.sort-a2 li { width: 50%; }
.sort-a3 li { width: 33.33333333%; }
.sort-a4 li { width: 25%; }
.sort-a5 li { width: 20%; }
.sort-a6 li { width: 16.66666667%; }
.sort-a7 li { width: 14.28571429%; }
.sort-a8 li { width: 12.5%; }
/* sort-b */
.sort-b { border-top: 1px solid rgb(230,0,0); border-bottom: 1px solid rgb(230,0,0); background: rgb(255,255,255); }
.sort-b li { float: left; text-align: center; padding: 15px 0px; }
.sort-b li a { color: rgb(40,40,40); }
.sort-b li a:hover { color: rgb(230,0,0); text-decoration: none; }
.sort-b .selected { color: rgb(230,0,0); }
.sort-b li span { margin-left: 10px; padding-left: 10px; border-left: 1px solid rgb(225,225,225); }
.sort-b4 li { width: 25%; }
.sort-b5 li { width: 20%; }
.sort-b6 li { width: 16.66666667%; }
.sort-b7 li { width: 14.28571429%; }
.sort-b8 li { width: 12.5%; }


/*-------------------------------------
pager
-------------------------------------*/
.pager { display: block; margin-bottom: 20px; margin-top: 30px; }
.pager-result { float: left; }
.pager-result .hit { font-size: 32px; font-weight: 400; line-height: 110%; margin: 0 5px 0 0; color: rgb(230,0,0); }
.pager-result .view { margin-left: 10px; }
.pager-pagination { float: right; text-align: center; }
.pager-pagination li { display: inline-block; margin-left: 4px; }
.pager-pagination li a { display: block; padding: 6px 14px; color: rgb(40,40,40); background: rgb(255,255,255); border: solid 1px rgb(40,40,40); border-radius: 2px; }
.pager-pagination li a:hover { color: rgb(255,255,255); background: rgb(40,40,40); text-decoration: none; }
.pager-pagination .current { padding: 6px 14px; color: rgb(255,255,255); background: rgb(40,40,40); border: solid 1px rgb(40,40,40); border-radius: 2px; }
.pager-pagination .prev { }
.pager-pagination .next { }


/*-------------------------------------
side-more
-------------------------------------*/
.side-more { display: block; text-align: center; border-top: 1px solid rgb(235,235,235); }
.side-more a { display: block; padding: 10px 15px; color: rgb(120,120,120); background: rgb(250,250,250); }
.side-more a:hover { text-decoration: none; background: rgb(255,255,255); }


/*-------------------------------------
side-menu
-------------------------------------*/
.side-menu { }
.side-menu li { border-top: solid 1px rgb(235,235,235); }
.side-menu li:first-child { border-top: none; }
.side-menu li a { display: block; padding: 15px 20px 15px 35px; color: rgb(40,40,40); }
.side-menu li a:before { content: ''; position: absolute; left: 20px; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid transparent; border-left: 6px solid rgb(230,0,0); margin-top: 5px; }
.side-menu li a:hover { color: rgb(230,0,0); }


/*-------------------------------------
side-history-girl
-------------------------------------*/
.side-history-girl {}
.side-history-girl > li { border-top: 1px solid rgb(235,235,235); }
.side-history-girl > li:first-child { border-top: none; }
.side-history-girl > li a { display: block; padding: 15px; box-sizing: border-box; }
.side-history-girl > li a:hover { background: rgb(255,255,235); }
.side-history-girl .pict { width: 40%; float: left; margin-right: 5%; }
.side-history-girl .info { width: 55%; float: left; position: relative; }
.side-history-girl .name { display: block; padding-top: 5px; line-height: 100%; font-size: 14px; color: rgb(230,0,0); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.side-history-girl .size { display: block; padding: 6px 0; color: rgb(120,120,120); }
.side-history-girl .time { display: block; width: 120px; text-align: center; padding: 1px 0 2px; color: rgb(255,255,255); background: rgb(230,0,0); border-radius: 2px; }
.side-history-girl .day { display: block; width: 120px; text-align: center; padding: 1px 0 2px; color: rgb(255,255,255); background: rgb(40,40,40); border-radius: 2px; }
.side-history-girl .other { display: block; width: 120px; text-align: center; padding: 1px 0 2px; color: rgb(180,180,180); background: rgb(240,240,240); border-radius: 2px; }
.side-history-girl .shop { display: block; margin-top: 6px; color: rgb(40,40,40); }
.side-history-girl .area { display: block; font-size: 11px; color: rgb(120,120,120); }


/*-------------------------------------
side-history-shop
-------------------------------------*/
.side-history-shop {}
.side-history-shop > li { border-top: 1px solid rgb(235,235,235); }
.side-history-shop > li:first-child { border-top: none; }
.side-history-shop > li a { display: block; padding: 15px; box-sizing: border-box; }
.side-history-shop > li a:hover { background: rgb(255,255,235); }
.side-history-shop .pict { width: 40%; float: left; margin-right: 5%; }
.side-history-shop .info { width: 55%; float: left; color: rgb(40,40,40); position: relative; }
.side-history-shop .shop { display: block; line-height: 100%; font-size: 14px; color: rgb(0,100,210); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.side-history-shop .area { display: block; font-size: 11px; margin-top: 4px; color: rgb(120,120,120); }
.side-history-shop .status { display: block; line-height: 100%; }
.side-history-shop .score { display: block; margin-top: 6px; }
.side-history-shop .score .icon { margin-right: 1px; color: rgb(255,200,0); font-size: 16px; font-weight: 300; }
.side-history-shop .score .count { margin-left: 2px; font-size: 16px; font-weight: 400; }
.side-history-shop .review { display: block; margin-top: 6px; }
.side-history-shop .review .icon { color: rgb(230,0,0); font-size: 16px; font-weight: 300; }
.side-history-shop .review .count { margin-left: 4px; font-size: 16px; font-weight: 400; }
.side-history-shop .review .small { font-size: 13px; font-weight: 300; }
.side-history-shop .basic { display: block; line-height: 100%; }
.side-history-shop .basic li { display: block; margin-top: 8px; }
.side-history-shop .basic .icon { float: left; margin-top: -1px; margin-right: 5px; color: rgb(0,0,0); font-size: 16px; font-weight: 300; }


/*-------------------------------------
side-useful
-------------------------------------*/
.side-useful {}
.side-useful li { margin-bottom: 15px; }
.side-useful li:last-child { margin-bottom: 0; }

/*-------------------------------------
side-best-ad
-------------------------------------*/


/*-------------------------------------
side-best-shop
-------------------------------------*/
.side-best-shop {}
.side-best-shop li { margin-bottom: 15px; background: rgb(255,255,255); }
.side-best-shop li:last-child { margin-bottom: 0; }



/*-------------------------------------
login
-------------------------------------*/
.login-wrap {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
  display: block;
}



/*-------------------------------------
form
-------------------------------------*/
label { cursor: pointer; }
label { position: relative; display: block; }
label span { display: inline-block; }
label input[type="checkbox"] + span { position: relative; padding: 0 0 0 26px; }
label input[type="radio"] + span { position: relative; padding: 0 0 0 26px; }
/* checkbox */
label input[type="checkbox"] { position: absolute; top: 0; left: 0; opacity: 0; }
label input[type="checkbox"] + span:before { position: absolute; top: 0; left: 0; display: inline-block; content: ''; box-sizing: border-box; }
label input[type="checkbox"] + span:after { position: absolute; top: 0; left: 0; display: inline-block; content: ''; box-sizing: border-box; }
label input[type="checkbox"] + span:before { z-index: 0; width: 20px; height: 20px; border: solid 1px rgb(200,200,200); border-radius: 3px; }
label input[type="checkbox"] + span::after { z-index: 1; margin: 4px 7px; width: 6px; height: 10px; }
label input[type="checkbox"]:checked + span::before { background-color: rgb(255,255,255); }
label input[type="checkbox"]:checked + span::after { border: solid 2.5px rgb(230,0,0); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); border-radius: 1px; }
/* radio */
label input[type="radio"] { position: absolute; top: 0; left: 0; opacity: 0; }
label input[type="radio"] + span::before { position: absolute; top: 0; left: 0; display: inline-block; content: ''; box-sizing: border-box; }
label input[type="radio"] + span:after { position: absolute; top: 0; left: 0; display: inline-block; content: ''; box-sizing: border-box; }
label input[type="radio"] + span:before { z-index: 0; width: 20px; height: 20px; border: solid 1px rgb(200,200,200); border-radius: 20px; }
label input[type="radio"] + span::after { z-index: 1; margin: 5px; }
label input[type="radio"]:checked + span::before { border-width: 1px; }
label input[type="radio"]:checked + span::after { border: solid 5px rgb(230,0,0); border-radius: 5px; }
/* text */
input[type="text"] { border: 0; outline: 0; }
input[type="text"] { padding: 5px; border: 1px solid rgb(235,235,235); border-radius: 3px; font-size: 13px; transition: border-color ease .2s; }
input[type="text"]:focus { border-color: rgb(95,152,225); }
/* textarea */
textarea { border: 0; outline: 0; font-family: sans-serif; }
textarea { padding: 5px; border: 1px solid rgb(235,235,235); border-radius: 3px; font-size: 13px; transition: border-color ease .2s; }
textarea:focus { border-color: rgb(95,152,225); }
/* select */
select { border: 0; outline: 0; }
select { padding: 5px; border: 1px solid rgb(235,235,235); border-radius: 3px; font-size: 13px; transition: border-color ease .2s; }
select:focus { border-color: rgb(95,152,225); }
/* submit */
input[type="submit"], button[type="submit"] { padding: 10px 60px; font-size: 14px; color: rgb(230,0,0); background: rgb(255,255,255); border: 1px solid rgb(230,0,0); border-radius: 4px; cursor: pointer; }
input[type="submit"]:hover, button[type="submit"]:hover { text-decoration: none; color: rgb(255,255,255); background: rgb(230,0,0); transition: all 0.2s ease-in-out 0s; }


