@charset "utf-8";
/* CSS Document */

/* --------------------------------------------------------------

     Author: カラーミーショップ
     Version: 0.1

-------------------------------------------------------------- */

/* -------------------------
COMMON
------------------------- */
body {
  font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  background: #fff;
  color: #333;
}
h1 {
  font-size: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
}
h2 {
  font-size: 14px;
  font-weight: normal;
  color: #2BA1B1;
  line-height: 1.4;
  margin-bottom: 10px;
}
div, p, li {
  font-size: 14px;
  line-height: 1.4;
  color: #333;
}
input[type="email"],
input[type="password"],
input[type="text"] {
  font-size: 14px;
  line-height: 20px;
  display: inline-block;
  height: 20px;
  padding: 4px 6px;
  color: #555;
  border-radius: 3px;
  background: #fff;
  border: 1px solid #CCC;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  transition: border linear 0.2s, box-shadow linear 0.2s;
  width: 93%;
  font-size: 12px;
}
input[type="checkbox"] {
  vertical-align: baseline;
}
a {
  color: #999;
  text-decoration: none;
}
table{
  border-spacing:0;
  border-collapse:collapse;
  border:0;
}
td,th{
  border:1px solid #333;
  padding:3px;
  font-size: 14px;
}

/* BUTTON STYLE */
.btn {
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  color: #fff;
  padding:8px 10px;
  text-align: center;
  min-width: 95px;
  background-color: #102563;
  border-radius: 4px;
}
.btn_primary {
  color: #fff;
  background-color: #102563;
}
.btn_success {
  color: #fff;
  background-color: #102563;
}
.btn_inverse {
  color: #fff;
  background-color: #102563;
}
.btn_decision {
  color: #ffffff;
  background: -moz-linear-gradient(
    top,
    #ed769a 0%,
    #ef3b6e);
  background: -webkit-gradient(
    linear, left top, left bottom,
    from(#ed769a),
    to(#ef3b6e));
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #ef3570;
  -moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0),
    inset 0px 0px 3px rgba(255,255,255,1);
  -webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0),
    inset 0px 0px 3px rgba(255,255,255,1);
  box-shadow:
    0px 1px 3px rgba(000,000,000,0),
    inset 0px 0px 3px rgba(255,255,255,1);
  text-shadow:
    0px -1px 0px rgba(240,31,97,0.5),
    0px -1px 0px rgba(239,31,97,0.5);
}

.btn_group {
  width: auto;
  text-align: center;
  padding: 10px;
}

/* TEXT STYLE */
.normal {
  color: #333;
}
.strong {
  font-weight: bold;
}
.attention {
  color: red;
}
.unpaid {
  color: #FFA09F;
}
.small {
  font-size: 10px;
}
.align_center {
  text-align: center;
}
.yet {
  color:#26889f;
  font-weight: bold;
}
.done {
  color:#ff872e;
  font-weight: bold;
}
.corner_title {
  background: #666;
  padding: 9px 10px 7px;
  margin-bottom: 0;
  color: #fff;
  font-size: 14px;
  font-weight: normal;
  border-bottom: 3px solid #999;
}
.warning {
  padding: 10px;
  background-color: #f6e7e7;
}
.warning * {
  color: inherit;
}
.cap {
  margin-bottom: 20px;
}
.lead {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px dotted #ccc;
}
.lead p {
  margin-bottom: 10px;
}
.accordion_close {
  text-align: center;
  padding: 10px 0 0;
}
.link_text {
  color: #FF5F75;
  text-decoration: underline;
}
.normal_text {
  color: #333;
  text-decoration: none;
}

/* LAYOUT STYLE */
.content_under {
  padding-bottom: 40px;
}
.page_padding {
  padding: 10px;
}
.page_margin {
  margin: 10px;
}
.page_margin_bottom {
  margin-bottom: 20px;
}
.block_margin_bottom {
  margin-bottom: 10px;
}

.unlist {
  padding: 10px;
  background: #fff;
}
.rounded_box {
  border-radius: 5px;
}
.border {
  border: 1px solid #059EC4;
  padding: 10px;
}
textarea {
  font-size: 14px;
  width: 96%;
  height: 100px;
}
select.select_menu {
  font-size: 16px;
  width: 100%;
  margin-bottom: 10px;
}

/* TABLE STYLE */
.tbl {
  width: 100%;
  margin-bottom: 10px;
  background: #fff;
}
.tbl th,
.tbl td{
  border: 1px solid #059EC4;
  padding: 8px;
  vertical-align: top;
}
.tbl th {
  background: #82CBDB;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  text-align: left;
  width: 80px;
}
.tbl th.attention {
  background: #FF5376;
}
.tbl th.received {
  background: #1B92BB;
}

/* LINK LIST STYLE */
.link_list li {
  border-bottom: 1px solid #ddd;
  padding-right: 30px;
  background: #fff url("img/arrow.png") no-repeat 97% center;
  background-size: 11px 18px;
}
.link_list li.unlist {
  padding: 10px;
  background: #fff;
}

.link_list li a {
  display: block;
  padding: 10px;
  color: #3F9ABC;
  text-decoration: none;
}

.link_list li input[type='submit'] {
  display: block;
  padding: 10px;
  color: #3F9ABC;
  font-size: 100%;
  border: none;
  background-color: transparent;
  width: 100%;
  text-align: left;
}

/* ROUNDED LINK LIST STYLE */
.rounded li:first-child {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.rounded li:last-child {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border-bottom: none;
}

/* HEADER */
#admin_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom:1px solid #ddd;
  padding: 10px;
}
#logo {
  width: 100px;
}
.logo_10th_s_admin {
  display: block;
  position: absolute;
  right: 5px;
  bottom: 0;
  width: 100px;
}
.logo_10th_s_admin img {
  width: 100px;
  height: auto;
}
/* color me shop award 2015 */
.logo_award2015_s_admin {
  display: block;
  position: absolute;
  right: 10px;
  top: 0;
  width: 100px;
  text-align: right;
}
.logo_award2015_s_admin img {
  width: 80px;
  height: auto;
}
/* color me shop award 2015 */
.logo_matsuri_s_admin {
  display: block;
  position: absolute;
  right: 5px;
  top: 5px;
  width: 90px;
  text-align: right;
}
.logo_matsuri_s_admin img {
  width: 90px;
  height: auto;
}

#logo img{
  width: 100px;
}
#shop_link {
  width: auto;
  float: right;
  margin-bottom: 0;
}
#shop_link .btn {
  font-size: 13px;
}
#shop_name {
  color: #fff;
  background: #2BA1B1;
  padding: 10px;
  margin: 0;
  border-bottom: 1px solid #82CBDB;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
}
#shop_acount {
  color: #fff;
  font-size: 11px;
  padding: 5px 10px;
  background: #666;
}
.admin_switch {
  font-size: 14px;
  font-weight: bold;
  width: 100%;
  padding: 15px 0;
  text-decoration: underline;
  color: #ff5f75;
  border: none;
  background: #eee;
}


/* CONTENT */
#warning_sametime {
  margin: 10px;
}

/* CLEARFIX */
.clearfix:before,
.clearfix:after {
  content:"";
  display:table;
}

.clearfix:after {
  clear:both;
}

/* -------------------------
LOGIN（ログイン）
------------------------- */
#page_login {
  background: #fff;
}
#lost_code {
  margin-bottom: 50px;
}
#lost_code li {
  padding: 5px 0 0 0;
}
#login_mode {
  text-align: right;
  margin-bottom: 5px;
}
#login_form {
  padding-top: 5px;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
/* -------------------------
TOP（トップ）
------------------------- */
#announcement {
  margin-bottom: 10px;
}
#announcement .box {
  background: #fff url("img/announcement_letter.png") repeat-x left top;
  font-size: 12px;
  padding-top: 5px;
  -webkit-box-shadow: 0px 3px 5px #C1C1C1;
}
#announcement .box_bottom {
  background: #fff url("img/announcement_letter.png") repeat-x left bottom;
  padding: 15px;
}
.period_title {
  color: #333;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.3;
}
#traial_period_countdown .period_title {
  border-bottom: 1px solid #F29898;
}
#traial_period .box {
  margin-top: 10px;
  padding: 10px;
  border: 3px solid #BCBCBC;
}
#traial_period_countdown .box {
  background: #FFECEC;
  padding: 10px;
  border: 3px solid #F29898;
}
#traial_period_finished .box {
  background: #333;
  color: #fff;
  padding: 10px;
  border: 3px solid #fff;
}
.box p {
  font-size: 13px;
  margin-top: 5px;
}
.box .btn {
  margin-top: 10px;
}
#point_display h2,
#calamel_status h2 {
  font-size: 14px;
  padding-bottom: 8px;
}
#point_display p {
  background: #fff;
  padding: 10px;
}
#shop_info {
  background: #B6E3DF;
  margin-top: 10px;
}
#shop_info h2 {
  color: #2D7B6D;
  font-size: 14px;
  margin-bottom: 10px;
}
#shop_info h3{
  line-height: 1.4;
}
#shop_info td,
#shop_info th {
  border: none;
  background: #fff;
  vertical-align: middle;
}
#shop_info table {
  width: 100%;
  font-size: 14px;
}
#shop_info td {
  padding: 10px;
}
#shop_info td a {
  font-weight: bold;
  color: #FF5F75;
  text-decoration: underline;
}
#shop_info th {
  width: 60px;
  padding: 10px;
  text-align: left;
}
#shop_info tr {
  border-bottom: 2px solid #B6E3DF;
}
#links {
  background: #ddd;
}


/* ACORDION MENU */

#menu {
  background: #ddd;
}
#menu h3 {
  display: block;
  padding: 10px 10px 10px 30px;
  border-bottom: 1px solid #ddd;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  background-color: #3F9ABC;
  }
.slidedown {
  background: url("img/icon_slidedown.png") no-repeat 10px center;
}
.slideup {
  background: url("img/icon_slideup.png") no-repeat 10px center;
}

/* -------------------------
CONT_LST（契約・お支払い情報）
------------------------- */
#cont_btn .btn_primary {
  width: 130px;
}
#past_period h2{
  background-position-x: 0;
  padding-left: 15px;
  margin-bottom: 5px;;
}
#past_period_wrap {
  background: #eee;
  padding: 10px;
}
/* -------------------------
CONT_PAY（料金支払）
------------------------- */

#select_pointuse {
  border-top: 1px dotted #ccc;
  margin-top: 10px;
  padding-top:10px;
}
#select_pointuse li {
  line-height: 2.2;
}
#cont_pay_charge th {
  width: 120px;
}
#cont_pay_payout th {
  width: 120px;
}
/* -------------------------
CONT_CONF（契約内容確認）
------------------------- */

#send_mobile {
  background: #ffe08d;
}
#cont_conf_charge th,
#cont_conf_pay th {
  width: 120px;
}

#cont_conf_bank td table th {
  background: #999;
}
#payment_methods {
  background: #eee;
}
#payment_methods_wrap {
  padding: 5px;
}
#payment_methods p {
  margin-bottom: 10px;
}
#payment_methods p:last-child {
  margin-bottom: 0;
}
#payment_methods h2 {
  background-color: #82CBDB;
  color: #fff;
  padding: 6px 10px 6px 30px;
  text-decoration: underline;
  margin-bottom: 5px;
}
.payment_method {
  background: #fff;
  padding: 10px;
  margin-bottom: 5px;
}
.payment_method:last-child {
  margin-bottom: 0;
}
#payment_methods h3 {
  padding-bottom: 5px;
  margin-bottom: 10px;
  border-bottom: 1px dotted #82CBDB;
}
#payment_methods h3 img {
  vertical-align: middle;
}

/* -------------------------
PAY_EXEC（料金支払い）
------------------------- */
#pay_exec_charge th,
#pay_exec_pay th {
  width: 120px;
}

/* -------------------------
CONT_END（解約）
------------------------- */

#before_cancells {
  background: #D2F1F4;
  margin-bottom: 40px;
  padding: 10px;
}
#cont_end h2 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}
#before_cancells h3 {
  margin-bottom: 10px;
}
#before_cancells p {
  margin-bottom: 10px;
}
#before_cancells p:last-child {
  margin-bottom: 0px;
}
.before_cancell {
  background: #fff;
  padding: 10px;
  margin-bottom: 5px;
}

/* -------------------------
CONT_UPD（契約更新手続き）
------------------------- */
#cont_upd_charge th,
#cont_upd_payout th {
  width: 120px;
}

/* -------------------------
IPHONE_OPTION_REGI（iPhoneアプリ申込前）
------------------------- */
.iphone_txt_emphasis {
  font-weight: bold;
  color: #FF3777;
}
#iphone_option_cap {
  text-align: center;
}
#iphone_option_cap p {
  text-align: center;
  font-weight: bold;
  color: #008b9d;
  font-size: 18px;
}
#iphone_option_cap span {
  color: #FC5085;
}
#iphone_option_cap img {
  max-width: 100%;
  height: auto;
  width: auto\9; /* ie8 */
}
#current_point {
  background: #FFE08D;
  margin-top: 10px;
  margin-bottom: 20px;
}
#current_point h2 {
  color: #000000;
  font-size: 14px;
  margin-bottom: 10px;
}
#current_point td,
#current_point th {
  border: none;
  background: #fff;
  vertical-align: middle;
}
#current_point table {
  width: 100%;
  font-size: 14px;
}
#current_point td {
  padding: 10px;
}
#tmf_catch {
  border: 5px solid #FC3B67;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
  font-weight: bold;
}
#tmf_catch_top {
  color: #158CA5;
}
#tmf_catch_middle {
  color: #000;
  margin-top: 5px;
}
#tmf_catch_bottom {
  color: #000;
  background-color: #FFEE75;
  margin-top: 5px;
  padding: 5px;
}
#tmf_catch_big {
  color: #F84166;
  font-size: 150%;
}
#option_pt {
  color: #000000;
  font-size: 18px;
  font-weight: bold;
  line-height: 100%;
  text-align: center;
}
#option_pt_link {
  font-weight: bold;
  line-height: 100%;
}
.process_num dt {
  font-weight: bold;
  color: #00B6CE;
  padding-bottom: 5px;
}
#iphone_option_btn .btn_decision {
  width: 280px;
  padding: 15px 0px;
  font-size: 16px;
}
#iphone_option_btn span {
  font-size: 20px;
}
#necessary_point {
  border-top: 1px solid #1BB5D1;
  border-bottom: 1px solid #1BB5D1;
  margin: 20px 0;
  padding: 10px 0;
  text-align: center;
  background-color: #E8F7FA;
}
#necessary_point_tmf {
  border-top: 1px solid #1BB5D1;
  border-bottom: 1px solid #1BB5D1;
  margin: 20px 0 0 0;
  padding: 10px 0;
  text-align: center;
  background-color: #E8F7FA;
}

#tmf_txt {
background:#fffbd0;
margin-bottom:20px;
padding:20px;
}
#tmf_txt_big {
color:#ff3a76;
font-weight:bold;
padding-bottom:10px;
border-bottom:1px solid #D9D900;
}
#tmf_txt_small {
padding-top:10px;
}
#tmf_txt_small span {
font-weight: bold;
}
#iphone_option_fin {
  text-align: center;
}
#iphone_download_btn img {
  width: 230px;
}
#iphone_research {
  border: 3px solid #FFE182;
  background-color: #fffbd0;
  padding: 10px;
}
#iphone_research_cam {
  color: #ff3a76;
  font-weight: bold;
  font-size: 14px;
  padding-bottom: 10px;
}
#iphone_research_tit {
  color: #000000;
  font-size: 14px;
  margin-bottom: 10px;
}
#iphone_research_txt {
  margin-bottom: 20px;
}
#iphone_research_link {
font-weight: bold;
}
#header_banner_area {
  text-align: center;
  margin: 10px 0 0;
}
#footer_banner_area {
  text-align: center;
  padding: 10px 0 10px;
  background: #ddd;
}

/* -------------------------
IPHONE_OPTION_CONF（iPhoneアプリ申込後）
------------------------- */
#download {
padding-bottom: 40px;
}

.update_info_date {
text-align: left;
float: left;
clear: both;
padding: 10px 0;
width: 100px;
}

.update_info_detail {
text-align: left;
padding: 10px 10px 10px 100px;
border-bottom: 1px dotted #ccc;
}

/* -------------------------
画像認証CSS
------------------------- */
.block_captcha {
  margin-top:20px;
}

.input_captcha_form {
  width:100%;
}

.img_captcha_wrap {
  padding:10px 0;
  text-align:center;
}

.form_wrap {
  text-align:center;
}

.txt_captcha_change {
  padding:5px 0 0;
  text-align:center;
}

.input_captcha {
  margin:10px 0;
}

/* -------------------------
消費税CSS
------------------------- */

.sales_tax_txt {
  margin-bottom: 10px;
}

/* -------------------------
アプリダウンロード導線
------------------------- */
.app-download-banner {
  width: 100%;
}
.app-download-wrap {
	background: #eee;
	padding: 10px;
}
.app-download-close-button {
	width: 24px;
	height: 24px;
  float: right;
  margin-bottom: 10px;
}

/* 初期費用無料キャンペーン用 */
.const_init_free em {
  color: #ff3a76;
  font-style: normal;
}
.const_init_free_note {
  margin: 5px -2px -2px;
  padding: 6px;
  background-color: #efefef;
}
.const_init_free_note_title {
  color: #ff3a76;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.6;
}
.const_init_free_note_text {
  font-size: 12px;
  line-height: 1.6;
}
.const_init_free_note_limit {
  font-size: 11px;
  color: #00b6ce;
  font-weight: bold;
  line-height: 1.6;
}

