/* ==================================================

 agree.php

================================================== */
/* 全体制御 */
#outer.agree *{
    box-sizing: border-box;
}

/* 見出し※全体使用 */
.top_tit{
    margin-bottom: 10px;
    padding: 10px;
    background-color: #63c3db;
    color: #fff;
    font-size: 14px;
    font-weight: normal;
}

/* 検索 */
#outer.agree .search_wrap form{
    display: flex;
    width: 100%;
}

#outer.agree .search_wrap form input[type="text"],
#outer.agree .search_wrap form input[type="submit"]{
    -webkit-appearance: none;
       -moz-appearance: none;
    appearance: none;
    padding: 10px;
    border: 1px #ccc solid;
    border-radius: 0;
    outline: none;
    font-family: inherit;
    font-size: 14px;
    line-height: 24px;
}

#outer.agree .search_wrap form input[type="text"]{
    flex: 1;
    border-right: none;
}

#outer.agree .search_wrap form input[type="submit"]{
    width: 20%;
    border-color: #666;
    background: no-repeat center;
    background-color: #666;
    background-image: url("/img_new/search_icon_white.png");
    background-size: 15px;
}

#outer.agree .search_wrap form input[type="submit"]:hover{
    opacity: .8;
}

/* お問い合わせの前に */
#outer.agree .bnr_box ul{
    display: flex;
    column-gap: 2%;
}

#outer.agree .bnr_box ul li{
    flex: 1;
}

#outer.agree .conts_title_2{ /* 退会フォームと競合 */
    margin-bottom: 5px;
    padding: 0 0 0 16px;
}

#outer.agree .conts_title_2::before{ /* 退会フォームと競合 */
    top: 5px;
    left: 0;
}

#outer.agree .support_date_wrap .fs_14{
    font-size: 14px;
}

#outer.agree .support_date_wrap li{
    text-align: justify;
    word-break: break-all;
}

#outer.agree .btn_wrap{ /* form部分と競合 */
    padding: 0;
}

/* snsアカウント */
#outer.agree .sns_btn_wrap{
    display: flex;
    column-gap: 2%;
}

#outer.agree .sns_btn_wrap .sns_btn{
    width: 32%;
    padding: 10px 0;
    background-color: #000;
    color: #fff;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0.05em;
    text-align: center;
    text-decoration: none;
}

#outer.agree .sns_btn_wrap .sns_btn:nth-child(2){
	background:-moz-linear-gradient(45deg, #e821a9 0%, #fc2a7e 25%, #fd3654 50%, #fd8c65 75%, #fc9b35 100%); 
	background:-webkit-linear-gradient(45deg, #e821a9 0%, #fc2a7e 25%, #fd3654 50%, #fd8c65 75%, #fc9b35 100%); 
	background:linear-gradient(45deg, #e821a9 0%, #fc2a7e 25%, #fc2a7efd3654 50%, #fd8c65 75%, #fc9b35 100%);
}

#outer.agree .sns_btn_wrap .sns_btn:last-child{
    background-color: #00B900;
}

/* ご注意事項 */
/* outer外のパーツのため一旦main_cssと同じもの設置 */
#main_form .notice_wrap.conts_box{
    margin: 15px 0;
}

#main_form .notice_wrap .conts_pad{
    padding: 10px;
}

#main_form .notice_wrap ul{    
    padding-top: 10px;
}

#main_form .notice_wrap ul li{
    margin-bottom: 5px;
    padding: 0 0 5px 1em;
    border-bottom: 1px #ccc dashed;
    color: #555;
    font-size: 12px;
    text-indent: -1em;
    word-break: break-all;
}

#main_form .notice_wrap ul li:last-child{
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}

/* ==================================================

 form.php > form関連共通設定はココ

================================================== */
/*====================
  入力フォーム
====================*/
/* 全体 */
#main_form{
    padding:10px 10px 30px;
}

#main_form .com{
    display:block;
    margin-top:5px;
    padding-left:1em;
    font-size:12px;
    line-height:1.6em;
    text-indent:-1em;
    color:#555;
}

#main_form .com a{
    text-decoration:underline;
    color:#1994da;
}

/* フォーム部品の初期化 */
.form input, .form button, .form textarea, 
.form select, .form option {
	margin:0;
	padding:0;
	background:none;
	border:none;
	border-radius:0;
	outline:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}

/* 各wrap */
#main_form .conts_box{
    margin-bottom:0;
    padding:0;
    background-color:#fff;
    box-shadow:0px 1px 3px 0px #ccc;
}

/* 見出し */
.form h3{
    padding:10px 5px 10px 10px;
    background-color:#fafafa;
    border-top:#ccc 1px solid;
    border-bottom:#ccc 1px dashed;
}

.form h3:first-child{
    border-top:none;
}

.form h3_title{
    margin:3px 0;
}

/* 必須アイコン */
main .must{
    margin:0 0 2px 6px;
    padding:2px 5px 1px;
    font-size:10px;
    font-weight: normal;
    text-align:center;
    color:#fff;
    background-color:#f74361;
}

/* お問い合わせの項目 */
.form .category{
    padding:10px;
}

.form .category .warning li{
    padding-left:1em;
    font-size:12px;
    line-height:1.6em;
    text-indent:-1em;
    color:#555;
}

.form .category select{
    margin:5px 0 15px;
    padding:10px;
    width:100%;
    font-size:14px;
    line-height:20px;
    text-align:left;
    color:#555;
    background-color:#f1f1f1;
    background-image:url("/img_new/select_arrow.png");
    background-repeat:no-repeat;
    background-size:24px 16px;
    background-position:right center;
    border-radius:3px;
    box-sizing:border-box;
}

/* お問い合わせ内容 */
.inquiry_text{
    padding:20px 10px 0;
    box-sizing:border-box;
}

.inquiry_text textarea,
.form textarea{
    padding:10px;
    width:100%;
    min-width:100%;
    max-width:100%;
    height:100px;
    min-height:100px;
    font-size:12px;
    line-height:1.6em;
    color:#555;
    border:#ddd 2px solid;
    box-sizing:border-box;
}

/* 個人情報取扱いに関する告知文チェックボックス */
.cont_agree{
    padding:10px;
    font-size:12px;
    line-height:1.6em;
    color:#555;
}

.cont_agree a{
    font-size:12px;
    color:#1994da;
}

.cont_agree input[type=checkbox]{
    display: none;
}

.cont_agree .checkbox{
    display:inline-block;
    position:relative;
    padding-left:26px;
    vertical-align: middle;
    box-sizing:border-box;
}

input[type=checkbox]:checked + .checkbox:before{
    opacity:1; /* チェック時の動作 */
}

/* 確認画面へbtn */
.btn_wrap{
    padding:10px;
}

.btn_wrap.p_0{
    padding: 0;
}

#main_form .go_btn{
    padding:0;
}

.btn_wrap .next_btn{
    width:100%;
    padding:10px;
    color:#fff;
    cursor:pointer;
    font-size:14px;
    line-height:24px;
    text-align:center;
    box-sizing: border-box;
}

/* 確認時エラー文 */
.err_com{
    margin-bottom:5px;
    padding-left:1em;
    font-size:12px;
    line-height:1.6em;
    text-indent:-1em;
    color:#f74361;
}

.form .out{ /* エラー文言が外出しの場合 */
    margin:0 10px;
}

#conts .day_search_link{
    margin:10px 0 0;
    color:#555;
    font-size:12px;
}

#conts .day_search_link a{
    color:#1994da;
}

#conts .msg{
    padding:0 10px 20px;
    color:#555;
    font-size:12px;
}

#conts .msg a{
    text-decoration:underline;
    color:#1994da;
}

/* ==================================================

 お問い合わせフォーム内 関連するFAQ / form_○○.php / ajax_load/load_contactus_○○.php

================================================== */

.faq_wrap{
    display: block;
    margin: 0 10px 20px;
    border: 2px solid #ccc;
    padding: 10px;
}

.faq_wrap .conts_title_faq{
    padding-bottom: 5px;
    margin: auto 0;
    font-size: 12px;
}

.faq_wrap .related_faq_wrap{
    padding-left: 5px;
}

.faq_wrap .related_faq_wrap a{
    color: #1994da;
    text-decoration: none;
}

.faq_wrap .faq_list .faq_box .faq_title{
    font-size: 12px;
    line-height: 2em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* FAQ出さないでテキスト直接表示の時 */
.faq_expansion_wrap div{
    padding: 10px;
    font-size: 12px;
    line-height: 1.6;
    color: #555;
    border-width: 2px
}

/* ==================================================

 広告クリック日検索 https://pointi.jp/contactus/day_search.php

================================================== */
#outer.main_form_wrap h3{
    padding:15px 0 15px 25px;
    margin-bottom:0;
    background-color:#fafafa;
    border-top:#ccc 1px solid;
    border-bottom:#ccc 1px dashed;
}

#outer.main_form_wrap h3:before{
    top:22px;
    left:10px;
}

/* 必須アイコン */
#outer.main_form_wrap .must{
    margin:0 0 0 5px;
    padding:2px 5px 1px;
    font-size:10px;
    text-align:center;
    color:#fff;
    background-color:#f74361;
}

#outer.main_form_wrap select{
    display:block;
    width:100%;
    padding:10px;
    margin:10px 0;
    font-size:14px;
    line-height:20px;
    text-align:left;
    color:#555;
    background-color:#f1f1f1;
    background-image:url("/img_new/select_arrow.png");
    background-repeat:no-repeat;
    background-size:24px 16px;
    background-position:right center;
    border-radius:3px;
    box-sizing:border-box;
}

#outer.main_form_wrap textarea{
    display:block;
    min-height:auto;
    margin:10px 0;
}

#outer.main_form_wrap .day_search_btn{
    margin:10px auto;
}

#outer.main_form_wrap .day_search_table{
    width:100%;
}

#outer.main_form_wrap .day_search_table th, 
#outer.main_form_wrap .day_search_table td{
    padding:10px;

    border-bottom:1px solid #ccc;
    font-size:12px;
    line-height:1.6em;
}

#outer.main_form_wrap .day_search_table th{
    background-color:#fdf9d8;
    font-weight:normal;
}

#outer.main_form_wrap .day_search_table th:last-child{
    width:70px;
    border-left:1px solid #ccc;
}

#outer.main_form_wrap .day_search_table td{
    border-top:1px solid #ccc;
    text-align:left;
}

#outer.main_form_wrap .day_search_table td:last-child{
    border-left:1px solid #ccc;
    text-align:center;
}

#outer.main_form_wrap .day_search_table tbody:last-child td{
    border-bottom:none;
}

#outer.main_form_wrap .day_search_no_box{
    padding:20px 10px 10px;
    font-size:12px;
    text-align:center;
}

#outer.main_form_wrap .pager_wrap{
    padding-bottom:20px;
    margin-bottom:0;
    border-top:1px solid #ccc;
    box-shadow:0 0 0 0;
}

/*====================
  確認画面
====================*/
/* 確認テキスト */
.inquiry_confir{
    padding:10px;
    font-size:12px;
    line-height:1.6em;
    color:#555;
}

/* 修正・送信btn */
.inquiry_btn{
    padding:20px 5px;
    width:100%;
    box-sizing:border-box;
}

.inquiry_btn li{
    float:left;
    padding:0 5px;
    width:50%;
    box-sizing:border-box;
}

.inquiry_btn a{
    display:block;
    padding:10px;
    width:100%;
    text-decoration:none;
    font-size:14px;
    line-height:24px;
    text-align:center;
    color:#fff;
    box-sizing:border-box;
}

.inquiry_btn .retake{
    background-color:#1994da;
}

.inquiry_btn .submit{
    background-color:#f74361;
}

/*====================
  送信完了ページ
====================*/
.thanks_img{
    margin-bottom:20px;
    text-align:center;
}

/* ==================================================

  form_1, form_4, form5
  ajax_load内共通パーツ

================================================== */
/* 共通css */
.form .h3_title{
    display:block;
}

.m_10{
    display:block;
    margin:10px;
}

.m_tb_10{
    display:block;
    margin:10px 0;
}

.m_tb_20{
    display:block;
    margin:20px 10px;
}

.m_trl_10{
    display:block;
    margin:10px 10px 0;
}

.m_l_26{
    margin-left:26px;
}

.p_10{
    display:block;
    padding:10px;
}

.p_10_block{
    display:block;
    padding:10px;
    font-size:12px;
    line-height:1.6em;
    color:#555;
}

.p_10_block p{
    font-size:12px;
    line-height:1.6em;
    color:#555;
}

.p_10_block a{
    color: #1994da;
}

#firstBox h3,
#SecondBox h3,
#fourthBox h3,
#thirdBox h3,
#fifthBox h3,
#sixthBox h3,
#seventhBox h3{ /* border表示処理 */
    border-top:#ccc 1px solid;
}

/* お問い合わせの種類 */
.form .cont_list{
    padding:15px 10px;
}

/* ラジオボタン・チェックボックス共通設定 */
.form input[type=radio],
.form input[type=checkbox]{
    display: none;
}

.form .radio,
.form .checkbox{
    display: inline-block;
    position: relative;
    vertical-align: middle;
    padding: 5px 0 5px 30px;
    font-size: 12px;
    line-height: 20px;
    color: #555;
    cursor: pointer;
    box-sizing: border-box;
}

.form input[type=radio]:checked + .radio:before,
.form input[type=checkbox]:checked + .checkbox:before{
  opacity: 1;
}

/* ラジオボタン */
.form .radio:after{
    display:block;
    position:absolute;
    top:5px;
    left:0;
    width: 16px;
    height: 16px;
    content:'';
    border:2px solid #bbb;
    border-radius:16px;
}
.form .radio:before {
    display:block;
    position:absolute;
    top: 10px;
    left: 5px;
    width: 10px;
    height: 10px;
    content:'';
    background-color:#1994da;
    border-radius:50%;
    opacity:0;
}

.form input[type=radio]:checked + .radio::after{
    border: 2px #1994da solid;
}

/* チェックボックス */
.checkbox:after {
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    width: 16px;
    height: 16px;
    content: '';
    border: 2px solid #ccc;
}

.checkbox:before {
    position: absolute;
    top: 9px;
    left: 7px;
    display: block;
    width: 4px;
    height: 6px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    content: '';
    opacity: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
}

.form input[type=checkbox]:checked + .checkbox::after{
    background-color: #1994da;
    border: 2px #1994da solid;
}

/* セレクトボックス */
.form .select_wrapper{
    padding:20px 10px;
}

.form .select_wrapper select,
.form .select_wrapper2 select{
    margin:0;
    padding:10px;
    width:100%;
    font-size:14px;
    line-height:20px;
    text-align:left;
    color:#555;
    background-color:#f1f1f1;
    background-image:url("/img_new/select_arrow.png");
    background-repeat:no-repeat;
    background-size:24px 16px;
    background-position:right center;
    border-radius:3px;
    box-sizing:border-box;
}

/* セレクトボックス - 生年月日のみ */
.form .select_wrapper .birthday_select{
    display: flex;
    align-items: center;
}

.form .select_wrapper .birthday_select select{
    padding: 10px 34px 10px 10px;
    width: auto;
}

.form .select_wrapper .birthday_select span{
    font-size: 12px;
    line-height: 20px;
    color: #555;
}

/* お名前 */
.form .con_name{
    padding:10px;
    width:100%;
    font-size:12px;
    line-height:1.6em;
    color:#555;
    border:#ddd 2px solid;
    box-sizing:border-box;
}

/* 電話番号 */
.form .phone_number{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.form .phone_number input{
    max-width: 120px;
}

.form .phone_number p{
    width: 20px;
    margin: 0 5px;
    text-align: center;
}

/* 返信希望のメールアドレス */
.form .adress_list{
    padding:15px 10px;
}

.form .adress_list .mail_add{
    display:block;
    padding:0 0 5px 26px;
    font-size:12px;
    line-height:1.6em;
    color:#555;
    word-break:break-all;
}

.form .adress_list .mail_add_area{
    display:block;
    padding:0 0 5px 26px;
    width:100%;
    box-sizing:border-box;
}

/* サービス全般＞ご利用時の環境 */
.form .select_wrapper2{
    padding:10px;
}

#sb_box select{
    margin:0;
    font-size:12px;
}

#sb_box li{
    float:left;
}

#sb_box .sb_title{
    width:28%;
}

#sb_box .sb_detail{
    width:72%;
}

#sb_box .item{
    display:block;
    padding:10px 10px 10px 0;
    font-size:12px;
    line-height:1.6em;
    color:#555;
}

#seventhBox .sb_detail{
    padding-left:10px;
    box-sizing:border-box;
}

/* 広告のご利用日 */
.sb_date_box li{
    float:left;
    padding-right:10px;
    box-sizing:border-box;
}

.sb_date_box li:last-child{
    padding-right:0;
}

.sb_date_box .select_year{
    width:40%;
}

.sb_date_box .select_md{
    width:30%;
}

/* ==================================================

 退会フォーム(cancel_form.php)

================================================== */
#outer .conts_title_2{
    padding: 10px 0 10px 25px;
    margin-bottom: 0;
}

#outer .conts_title_2:before{
    top: 18px;
    left: 10px;
}
.cancel_form_box a{
    color: #1994da;
}

/* ご利用状況 */
.cancel_form_box .cancel_form_table{
    width: 100%;
}

.cancel_form_box .cancel_form_table th,
.cancel_form_box .cancel_form_table td{
    padding: 5px;
    border: 1px #ccc solid;
    box-sizing: border-box;
    color: #555;
    font-size: 12px;
    line-height: 1.6em;
}

.cancel_form_box .cancel_form_table th{
    width: 50%;
    background-color: #f2f2f2;
    font-weight: normal;
    text-align: left;
}

.cancel_form_box .cancel_form_table td{
    text-align: right;
}

/* 現在の会員ランク */
.cancel_form_box .rank th{
    text-align: center;
}

.cancel_form_box .rank td{
    width: 20%;
    text-align: center;
}

.cancel_form_box .rank th.on,
.cancel_form_box .rank td.on{
    background-color: #fdf9d8;
}

/* format.php枠 */
.ad{
    padding-bottom:10px;
    margin-top:10px;
}

/* 退会手続きボタン */
#sub{
    padding: 0 0 20px;
}

#sub .modal_secret{
    display:block;
    width:90%;
    padding:10px;
    margin:0 auto;
    background-color:#f74361;
    color:#fff;
    font-size:14px;
    line-height:24px;
    text-align:center;
}

/*====================
  check_modal.php
====================*/
.profile_form2_wrap{
    padding: 30px 10px 10px;
}

.profile_form2_wrap .step{
    padding: 10px;
    margin-bottom: 15px;
    background-color: #f2f2f2;
    color: #555;
    font-size: 12px;
    line-height: 1.6;
}

.profile_form2_wrap .form_title{
    margin-bottom: 5px;
    color: #555;
    font-size: 12px;
}

/* セレクトボックス */
.profile_form2_box select{
	display: block;
    width: 100%;
    padding: 10px;
    margin: 0 0 15px;
    background-color: #fff;
    background-image: url("/img_new/select_arrow.png");
    background-repeat: no-repeat;
    background-size: 30px 20px;
    background-position: right center;
    border: #999 1px solid;
    border-radius: 3px;
    box-sizing: border-box;
    color: #555;
    font-size: 14px;
    line-height :24px;
    text-align: left;
}

/* テキストボックス */
.profile_form2_box input[type="text"]{
	display: block;
    width: 100%;
    padding: 10px;
	margin-bottom: 5px;
    border: #999 1px solid;
    border-radius: 3px;
    box-sizing: border-box;
    color: #555;
    font-size: 12px;
    line-height: 24px;
}

.profile_form2_box .err_com{
    margin-left: 0;
    margin-bottom: 10px;
}

.profile_form2_box .com2{
	margin-bottom:  5px;
    color: #f74361;
    font-size: 12px;
}

.profile_form2_box .com3{
    display: block;
	color: #555;
    font-size: 12px;
    text-align: right;
}

.profile_form2_box .com3 a{
    text-decoration: underline;
    color: #1994da;
}

/* ==================================================

 退会者アンケート(cancel_enquete.php)

================================================== */
#cancel_form .inquiry_text{
    padding: 20px 0 0;
}

#cancel_form .m_trl_10{
    margin: 20px 10px 0;
}

.com4{
    display:block;
    margin: 5px 0 0;
    font-size: 12px;
    font-weight: bold;
    text-align: right;
}

/* ==================================================

 送信完了 / cancel_compleate.php

================================================== */
.contactus_comp_box .thanks_txt{
    text-align: center;
}

.contactus_comp_box .cite{
    text-align: right;
}

.contactus_comp_box img{
    display: block;
    margin: 10px auto;
}