@charset "UTF-8";

* {  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box;   box-sizing: border-box; }

html { width:100%; height:100%; }
html { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -o-text-size-adjust: 100%; text-size-adjust: 100%;}
body { line-height:1.0; margin:0; padding:0;  width:100%; height:100%; background-color:#ffffff; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch;}
body { font-family: "游ゴシック","YuGothic", "Yu Gothic", "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic" !important; }

/* --------------------------------------------------------------------------
Grobal
---------------------------------------------------------------------------- */
a { color: #000000; font-style:normal; text-decoration:none; }
a { -webkit-tap-highlight-color:rgba(0,0,0,0); }
a:link { color: #000000; font-style:normal; text-decoration:none; }
a:visited { color: #000000; font-style:normal; text-decoration:none; }
a:hover { color: #000000; font-style:normal; text-decoration:none; }
a img { border: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
::-webkit-input-placeholder { color:#9B9D99; text-align:center; }
::-ms-input-placeholder { color:#9B9D99; text-align:center; }
::-moz-placeholder { color:#9B9D99; text-align:center; }
input:focus::-webkit-input-placeholder,isindex:focus::-webkit-input-placeholder,textarea:focus::-webkit-input-placeholder { color: transparent; }

input { -webkit-appearance:none; }
select { -webkit-appearance: button; appearance: button;}
img { width:100%; margin:0; padding:0; }

/* --------------------------------------------------------------------------
Font
---------------------------------------------------------------------------- */
@font-face {
font-family: 'marvelous';
src: url('./font/atlantisfound.eot');
src: url('./font/atlantisfound.eot?#iefix') format('embedded-opentype'),
url('./font/atlantisfound.woff2') format('woff2'),
url('./font/atlantisfound.woff') format('woff'),
url('./font/atlantisfound.ttf') format('truetype'),
url('./font/atlantisfound.svg#atlantis_foundregular') format('svg');
font-weight: normal; font-style: normal;}
@font-face {
font-family: 'nom';
src: url('./font/caviardreams.eot');
src: url('./font/caviardreams.eot?#iefix') format('embedded-opentype'),
url('./font/caviardreams.woff2') format('woff2'),
url('./font/caviardreams.woff') format('woff'),
url('./font/caviardreams.ttf') format('truetype'),
url('./font/caviardreams.svg#caviar_dreamsregular') format('svg');
font-weight: normal; font-style: normal; }
@font-face {
font-family: 'bonv';
src: url('./font/bonvenocf-light.eot');
src: url('./font/bonvenocf-light.eot?#iefix') format('embedded-opentype'),
url('./font/bonvenocf-light.woff2') format('woff2'),
url('./font/bonvenocf-light.woff') format('woff'),
url('./font/bonvenocf-light.ttf') format('truetype'),
url('./font/bonvenocf-light.svg#bonvenocflight') format('svg');
font-weight: normal; font-style: normal; }
@font-face {
font-family: 'slay';
src: url('./font/slay.woff') format('woff');
font-weight: normal;
font-style: normal; }
@font-face {
font-family: 'bozu';
src: url('./font/bozu.woff') format('woff');
font-weight: normal;
font-style: normal; }


/* --------------------------------------------------------------------------
Color
---------------------------------------------------------------------------- */
.bg_white  { background-color: #ffffff !important; }
.bg_blue   { background-color: #5E96FF !important; }
.bg_pink   { background-color: #FF5FF4 !important; }
.bg_orange { background-color: #FF8015 !important; }
.bg_green  { background-color: #42D6A5 !important; }
.bg_black  { background-color: #000000 !important; }
.bg_gray   { background-color: #7A7A7A !important; }
.bg_red    { background-color: #FF423A !important; }
.bg_parple { background-color: #CC36BB !important; }
.bg_redpar { background-color: #CC2182 !important; }
.bga_blue  { background-color: #D3F5FF !important; }
.bga_pink  { background-color: #FEE1FF !important; }
.str_white { color:#fff !important; }

/* --------------------------------------------------------------------------
Fixed
---------------------------------------------------------------------------- */
.myfixed { width:100%; height:100%; margin:0; padding:0; position: fixed; top:0; left:0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling:touch; }
.mycent  { width:100%; margin:0; padding:0; overflow: hidden; text-align: center; }
.mybtn   { width:150px; margin:20px auto 0 auto; padding:10px 0 10px 0; text-align: center; color:#ffffff; cursor: pointer; }
.z99     { z-index: 99; }
.z98     { z-index: 98; }
.z97     { z-index: 97; }
.p_max   { width:100%; margin:0; padding:0; text-align: center; }
.p_80    { width:100%; max-width:300px; margin:0 auto 0 auto; padding:0; text-align: center; }
.ub_solid{ border-style: solid; border-color: #000000; border-width: 0 0 1px 0; }
.damy    { width:100%; height:70px; margin:0; padding:0; }
.csp     { cursor:pointer; }
.txt_left{ text-align:left !important; }

/* --------------------------------------------------------------------------
POP UP
---------------------------------------------------------------------------- */
div.popin { width:80%; max-width: 500px; margin:40px auto 0 auto; padding:40px 0 40px 0; border-radius: 5px; font-family: bonv; text-align: center; }
p.poptitle { width:70%; margin:0 auto 0 auto; padding:0 0 5px 0; border-style: solid; border-color:#000000; border-width: 0 0 1px 0; font-size:130%; font-weight: 800; text-align: center; }
p.popinfo { width:80%; margin:0 auto 0 auto; padding:20px 0 5px 0; font-size:100%; text-align: center; }


/* --------------------------------------------------------------------------
Index
---------------------------------------------------------------------------- */
p.marvelous { width:100%; margin:0; padding:240px 0 0 0; text-align: center; font-size: 250%; color:#ffffff; font-family: slay; }
p.title { width:100%; margin:0; padding:60px 0 0 0; text-align: center; font-size: 200%; color:#5E96FF; font-family: bozu; }
p.pintitle { margin:70px auto 0 auto; font-size: 110%; color:#555553; font-weight: 800;}
p.pininfo { margin:10px 0 0 0; font-size: 100%; color:#949591;}
p.authority { width:80%; margin:10px auto 0 auto; max-width: 400px; padding:0 0 50px 0; font-size: 100%; color:#949591; text-align: left; }
input.pincode { width:80%; max-width: 300px; margin:10px auto 0 auto !important; padding:15px 5px 15px 5px; background-color: rgba(0,0,0,0.2); border:none; font-size: 140%; border-radius: 0; text-align: center; }
span.sm { font-size: 60%; color:#979794; font-weight: 100; }
input.cgo { width:150px; margin:40px auto 0 auto; padding:15px 0 15px 0; border:none; border-radius: 3px; color:#ffffff; font-size: 120%; cursor: pointer; }
input.cgo { background-color:#658FF2; background:-webkit-gradient(linear, left top, left bottom, from(#658FF2), to(#658FF2)); -webkit-appearance:none; }


/* --------------------------------------------------------------------------
Menu
---------------------------------------------------------------------------- */
div.menu1 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/menu.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; right:5px; z-index: 98; }
div.close1 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/close.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; right:5px; z-index: 98; }
div.totop1 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/top.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; right:70px; z-index: 98; }

div.menu2 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/menu.png); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; left:5px; z-index: 98; }
div.close2 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/close.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; left:5px; z-index: 98; }
div.totop2 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/top.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; bottom:5px; left:70px; z-index: 98; }

div.menu3 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/menu.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; left:5px; z-index: 98; }
div.close3 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/close.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; left:5px; z-index: 98; }
div.totop3 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/top.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; left:70px; z-index: 98; }

div.menu4 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/menu.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; right:5px; z-index: 98; }
div.close4 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/close.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; right:5px; z-index: 98; }
div.totop4 { width:60px; height:60px; margin:0; padding:0; background-image: url(../images/index/top.png?20161115115200); background-size: 100% 100%; cursor: pointer; position: fixed; top:5px; right:70px; z-index: 98; }

p.menutitle { width:80%; max-width: 400px; margin:50px auto 0 auto; padding:0 0 5px 0; border-style: dashed; border-color: #ffffff; border-width: 0 0 1px 0; text-align: center; font-size:120%; color:#ffffff; }
div.menubox { width:80%; max-width: 500px; margin:10px auto 0 auto; padding:0; overflow: hidden; text-align: center; }
p.menubtn { margin:5px 1% 5px 1%; padding:10px; background-color: #ffffff; color:#5E96FF; font-size: 100%; float: left; cursor: pointer; }
p.menubtn:hover { margin:5px 1% 5px 1%; padding:10px; background-color: #FFC2F7; color:#000000; font-size: 100%; float: left; cursor: pointer; }


/* --------------------------------------------------------------------------
Res
---------------------------------------------------------------------------- */
div.ress { width:100%; max-width: 500px; margin:40px auto 0 auto; padding:0; }
div.resbox { width:90%; margin:10px auto 0 auto; padding:5px 0 5px 0; border:solid #B4AEA8 1px;}
div.resbox p.date { width:90%; margin:0 auto 0 auto; padding:0; text-align: left; color:#A5A59F; font-size: 90%; }
div.resbox p.shopname { width:90%; margin:5px auto 0 auto; padding:0; text-align: left; font-size: 110%; }
div.resbox pre.message { width:90%; height:auto; margin:5px auto 0 auto; padding:2px 0 0 0; overflow: hidden; white-space: pre-wrap; word-wrap: break-word; font-size: 100%; color:#797571; letter-spacing: 1.5px; }
div.resbox p.resed { width:90%; margin:5px auto 0 auto; padding:0; text-align: right; font-size: 90%; color:#000000;}
div.resbox p.edit { width:10%; margin:5px 1% 0 89%; padding:5px 0 5px 0; text-align: center; font-size: 80%; color:#ffffff; cursor: pointer; }


/* --------------------------------------------------------------------------
Driver
---------------------------------------------------------------------------- */
p.drst { margin:0; padding:5px; color:#fff; position:absolute; bottom:0; right:0; }



/* --------------------------------------------------------------------------
TakeOver
---------------------------------------------------------------------------- */
div.take { width:90%; margin:30px auto; padding:0; text-align:left; overflow:hidden; }
div.take p.day { width:100%; margin:0; padding:10px 0 30px 0; color:#000; font-size:120%; text-align:center; float:left; }
div.take p.left { width:60%; margin:0; padding:10px 0 0 0; color:#767676; font-size:100%; text-align:right; float:left; }
div.take p.right { width:40%; margin:0; padding:10px 0 0 0; color:#000; font-size:100%; text-align:left; float:left; }
div.take p.dams { width:100%; margin:0; padding:0; height:20px; float:left; }
p.dbtn { width:150px; margin:30px auto 0 auto; padding:10px 0 10px 0; background-color:#5DACF5; color:#fff; font-size:100%; cursor: pointer; text-align: center; }


/* --------------------------------------------------------------------------
Woman
---------------------------------------------------------------------------- */
div.wdiv { width:90%; margin:0 auto 0 auto; padding:10px 0 10px 0; border-style:solid; border-color:#000; border-width:1px 0 0 0; text-align:left; overflow: hidden; color:#8F8F8F; font-size:100%; }
div.wdiv p.wname { width:50%; margin:0; padding:0; float:left; font-size:110%; color:#000; }
div.wdiv p.wsta { width:40%; margin:0 0 0 10%; padding:3px 0 3px 0; text-align:center; border-radius:3px; float:left; }
div.wdiv p.wshift { width:90%; margin:10px 5% 0 5%; padding:0; float:left; }


/* --------------------------------------------------------------------------
Calendar
---------------------------------------------------------------------------- */
table.calendar { border-collapse: collapse; border:none; width:99%; max-width: 400px; margin:30px auto 0 auto; padding:0; }
table.calendar { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; }
table.calendar tr.w { height:40px; width:100%; }
table.calendar tr { height:50px; width:100%; }
table.calendar tr.w td.week { border-style:solid; border-width:0 1px 0 0; border-color:#ffffff; padding:0; text-align: center; vertical-align: middle; background-color:#DCE1E4; font-size:80%; cursor: pointer;}
table.calendar tr.w td.week:last-child { border:none; cursor: pointer;}
table.calendar tr td.day { border-style:solid; border-width:1px 1px 0 0; border-color:#DBE0E3; padding:0; text-align: center; vertical-align: middle; font-size:90%; color:#6D6E6D; cursor: pointer; }
table.calendar tr td.day:last-child { border-style:solid; border-width:1px 0 0 0;  cursor: pointer;}
table.calendar tr td.no-day { background-color:#DBE0E3; border-style:solid; border-width:1px 1px 0 0; border-color:#DBE0E3; opacity:0.2; padding:0; text-align: center; vertical-align: middle; }
table.calendar tr td.today { border-style:solid; border-width:1px 1px 0 0; border-color:#DBE0E3; padding:0; text-align: center;  font-size:90%; vertical-align: middle; background-image: url(../images/calendar/rec.png); background-size:100% 100%; color:#ffffff; cursor: pointer;}
table.calendar tr td.today-on { border-style:solid; border-width:1px 1px 0 0; border-color:#DBE0E3; padding:0; text-align: center;  font-size:90%; vertical-align: middle; background-image: url(../images/calendar/rec-on.png); background-size:100% 100%; color:#ffffff; cursor: pointer;}
table.calendar tr td.day-on { border-style:solid; border-width:1px 1px 0 0; border-color:#DBE0E3; padding:0; text-align: center;  font-size:90%; vertical-align: middle; background-image: url(../images/calendar/no-on.png); background-size:100% 100%; color:#6D6E6D; cursor: pointer;}
div.dframe { width:80%; max-width: 300px; margin:20px auto 0 auto; padding:0; overflow: hidden; }
div.dframe p.prev { width:25%; margin:0; padding:0; text-align: center; float:left; overflow: hidden; display: block; font-size:100%; }
div.dframe p.next { width:25%; margin:0; padding:0; text-align: center; float:left; overflow: hidden; display: block; font-size:100%; }
div.dframe p.date { width:50%; margin:0; padding:0; text-align: center; float:left; overflow: hidden; display: block; font-size:120%; }

div.today-plan { width:80%; max-width: 300px; margin:10px auto 0 auto; padding:10px 0 10px 0; border-radius: 5px; background-color: #C4E1FF; }
div.today-plan p.times { width:95%; margin:0 auto; padding:0 0 10px 0; color:#000000; font-size:120%; text-align: left; font-weight: 600; }
div.today-plan p.shopname { width:90%; margin:5px auto 0 auto; padding:0; text-align: left; font-size: 110%; }
div.today-plan pre.message { width:90%; height:auto; margin:5px auto 0 auto; padding:2px 0 0 0; overflow: hidden; white-space: pre-wrap; word-wrap: break-word; font-size: 100%; color:#797571; letter-spacing: 1.5px; }
div.today-plan p.toups { width:90%; margin:10px auto 0 auto; padding:0; color:#ABACAA; font-size:90%; text-align: right; font-weight: 10;}
div.today-plan p.edit { width:10%; margin:5px 1% 0 89%; padding:5px 0 5px 0; text-align: center; font-size: 80%; color:#ffffff; cursor: pointer; border-radius: 3px;}
div.today-plan p.line { width:30%; margin:5px 1% 0 69%; padding:5px 0 5px 0; text-align: center; font-size: 80%; color:#ffffff; cursor: pointer; border-radius: 3px;}


/* --------------------------------------------------------------------------
Authority
---------------------------------------------------------------------------- */
p.sf { width:90%; max-width: 300px; margin:20px auto 0 auto; padding:10px 0 0 0; color:#6D706B; font-size: 100%; text-align: left; overflow: hidden; cursor: pointer; }
span.on_btn  { width:20%; margin:-10px 0 0 0; padding:10px 0 10px 0; background-color: #FF441C; color:#ffffff; text-align: center; float:right; display: inline-block; font-family:bonv; cursor: pointer; }
span.off_btn { width:20%; margin:-10px 0 0 0; padding:10px 0 10px 0; background-color: #8D8D85; color:#ffffff; text-align: center; float:right; display: inline-block; font-family:bonv; cursor: pointer; }
span.on_btns  { width:20%; margin:-10px 0 0 0; padding:10px 0 10px 0; background-color: #3C51FF; color:#ffffff; text-align: center; float:right; display: inline-block; font-family:bonv; cursor: pointer; }
span.off_btns { width:20%; margin:-10px 0 0 0; padding:10px 0 10px 0; background-color: #8D8D85; color:#ffffff; text-align: center; float:right; display: inline-block; font-family:bonv; cursor: pointer; }

div.hidepop { width:100%; margin:0; padding:40px 0 40px 0; background-color: rgba(0,0,0,0.7); color:#ffffff; position: fixed; top:0; left:0; display: block; text-align: center; }
div.hidepop p.hidestr { width:80%; max-width: 300px; margin:0 auto 0 auto; padding:0; text-align: left; font-size: 100%; }


/* --------------------------------------------------------------------------
SETTING
---------------------------------------------------------------------------- */
p.pcs { width:90%; margin:10px auto 0 auto; padding:5px 0 10px 0; color:#737079; border-style: solid; border-color: #000000; border-width:0 0 1px 0; white-space: nowrap; overflow: hidden; cursor: pointer; max-width: 500px; }
p.pcs span.sinsei { margin:0; padding:0 4px 0 4px; background-color: red; color:#ffffff; }
p.damy { width:100%; margin:0; padding:0; height:100px; }
input.cgo { width:150px; margin:40px auto 0 auto; padding:15px 0 15px 0; border:none; border-radius: 3px; color:#ffffff; font-size: 120%; cursor: pointer; }
input.cgo { background-color:#658FF2; background:-webkit-gradient(linear, left top, left bottom, from(#658FF2), to(#658FF2)); -webkit-appearance:none; }
input.cgos { width:150px; margin:40px auto 0 auto; padding:15px 0 15px 0; border:none; border-radius: 3px; color:#ffffff; font-size: 120%; cursor: pointer; }
input.cgos { background-color:#F787E9; background:-webkit-gradient(linear, left top, left bottom, from(#F787E9), to(#F787E9)); -webkit-appearance:none; }
p.er { width:90%; margin:10px 5% 0 5%; padding:10px 0 10px 0; text-align:center; font-size:90%; color:#ffffff; font-family: meiryo ; background-color:#f34c89;letter-spacing:2px; }
select.pinset { width:100px; margin:30px auto 0 auto; padding:10px; font-size:100%; border:solid 1px #9D9D9D; }
p.pbtn { width:100px; margin:30px auto 0 auto; padding:10px 0 10px 0; background-color:#5B91EA; color:#fff; font-size:110%; }

/* --------------------------------------------------------------------------
Kintai
---------------------------------------------------------------------------- */
p.kint { width:100%; margin:15px 0 0 0; padding:0; text-align: center; font-size: 110%; }

/* --------------------------------------------------------------------------
Month move
---------------------------------------------------------------------------- */
div.contbox { width:80%; margin:30px auto 0 auto; padding:0; overflow: hidden; text-align: center; }
div.contbox p.al { width:100%; margin:10px 0; padding:0; font-size: 120%; }
div.contbox p.al span.prev { margin:0 10px 0 0; padding:0; display: inline-block; }
div.contbox p.al span.next { margin:0 0 0 10px; padding:0; display: inline-block; }
div.contbox p.al span.cend { margin:0; padding:0; }


/* --------------------------------------------------------------------------
Woman info
---------------------------------------------------------------------------- */
select.wio { width:300px; margin:10px auto 0 auto; padding:10px; font-size:90%; border-radius: 2px; background: #FFE1FF; color:#7F7F7F; border:none; }