海外発送/国際配送サービスの転送コム

作品名インデックス title index

作品名一覧

インフォメーション information

Infomatin

【重要】 キャラアニ.comへのお問い合わせ後、返信が届いていないお客様は、キャラアニ.comからのメールが正常に受信出来ていない可能性がございます。迷惑メールフォルダのご確認、【@chara-ani.com】からのメールが受信できるように設定をお願いいたします。
商品の発売日変更のお知らせ
X公式アカウント
STU48劇場盤 抽選申込みフォーム
キャラアニ・チャンス
CAワークス
くじ引き堂
BOOKWALKER: 出版社直営の電子書籍ストア
ORICON
JAPAN billboard CHART PARTNER SHOP

トップ >>

@charset "UTF-8"; /*----------------------------------------------- font -----------------------------------------------*/ @import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap&subset=japanese"); @import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap&subset=japanese"); @import url("http://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanjp.min.css"); @import url("https://cdn.jsdelivr.net/npm/yakuhanjp@3.3.1/dist/css/yakuhanjp.min.css"); @import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); @import url('http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); @import url('http://use.fontawesome.com/releases/v5.8.2/css/all.css'); @import url('https://use.fontawesome.com/releases/v5.8.2/css/all.css'); .tokusetsu .sp { display: none !important; } /*----------------------------------------------- SNS -----------------------------------------------*/ .sns-wrap { margin: 5px 0 5px 3px !important; } .sns-wrap .fb-like { margin-top: -2px !important; } /*----------------------------------------------- base -----------------------------------------------*/ .tokusetsu { position: relative; overflow: hidden; width: 100%; height: auto; margin: 0; padding: 0; text-align: center; color: #231815 !important; font-size: 62.5% !important; line-height: 1 !important; font-family: YakuHanJP, 'Noto Sans JP', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS ゴシック", sans-serif; display: block; background-color: #fff; background: url(https://static.chara-ani.com/ca/static/rikakoaida-thetv/images/bg.png) repeat; background-size: contain; z-index: 1; content: ""; /* IE6-9 */ -moz-font-feature-settings: "palt"; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; } .caution_box { display: block; text-align: center; background-color: rgba(255, 255, 255, 0.3); padding: 10px; } .tokusetsu p.caution_text { font-size: 12px !important; text-align: left; } .tokusetsu p.caution { font-size: 12px !important; } /*----------------------------------------------- ヘッダー -----------------------------------------------*/ .tokusetsu .header { position: relative; display: block; width: 720px; height: auto; } .tokusetsu .header h3 img { width: 100%; height: auto; } /*----------------------------------------------- lead -----------------------------------------------*/ .tokusetsu .lead { margin: 15px 0 40px; } .tokusetsu .lead img { width: 672px; margin: 0 auto; } /*----------------------------------------------- 販売期間 -----------------------------------------------*/ .tokusetsu .data { position: relative; width: calc(100% - 60px); font-size: 15px; margin: 0 auto 50px; } .tokusetsu .data .number { font-size: 30px !important; font-weight: 500; line-height: 0.8 !important; margin: 0 0 15px !important; letter-spacing: 1px; } .tokusetsu .data .number span { font-size: 22px !important; } .tokusetsu .data .number small { font-size: 20px !important; } .tokusetsu .data .number span, .tokusetsu .data .number small { font-weight: 700; } /*----------------------------------------------- 見出し -----------------------------------------------*/ .tokusetsu h4 { display: inline-block; position: relative; width: 100%; background-color: #FFFFFF; font-size: 30px !important; font-weight: 600; margin: 0 0 20px; padding: 3px 0 6px; border: 5px solid #ffcb66; border-radius: 50px; box-sizing: border-box; } /*----------------------------------------------- commod -----------------------------------------------*/ .tokusetsu .commod { position: relative; width: calc(100% - 60px); text-align: center; margin: 0 auto; } /*----------------------------------------------- 商品一覧 -----------------------------------------------*/ .tokusetsu .item-block { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-flow: row wrap; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; } .tokusetsu .item { position: relative; display: -webkit-flex; display: -moz-flex; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-flow: column nowrap; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; z-index: 0; vertical-align: top; text-align: center !important; width: 300px; color: #fff; margin: 0 17.5px 20px !important; padding: 0 0 15px !important; border: 2px solid #231815; background-color: #FFFFFF; -webkit-border-radius: 5px; -ms-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } /*----------------------------------------------- 商品画像 スライダー .tokusetsu .swiper-container { position: relative; box-sizing: border-box; display: inline-block; width: 300px; height: auto; margin: 0 auto 10px !important; padding: 0px !important; text-align: center !important; border: 1px solid #ececec; } .tokusetsu .item-block.column2 .item .swiper-container { width: 100%; } .tokusetsu .detail .swiper-container { display: block; width: 100%; } .tokusetsu .swiper-slide { text-align: center !important; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-preorders: center; align-preorders: center; } .tokusetsu .swiper-container img, .tokusetsu .swiper-slide img { width: 100%; height: auto; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .tokusetsu .swiper-slide img { cursor: -webkit-zoom-in; cursor: zoom-in; } .tokusetsu .swiper-container .swiper-pagination { position: absolute; bottom: 8px; } .tokusetsu .swiper-container .swiper-pagination-bullet { width: 11px; height: 11px; opacity: 1; background-color: #fff; margin: 0 3px !important; border: 1px solid #285ebb; } .tokusetsu .swiper-container .swiper-pagination-bullet-active { background-color: #285ebb; } @media all and (-ms-high-contrast: none) { .tokusetsu .swiper-container .swiper-pagination-bullet { padding-top: 1px; } } -----------------------------------------------*/ /*----------------------------------------------- 商品画像 -----------------------------------------------*/ .tokusetsu .item .box { position: relative; width: 100%; height: auto; margin: 0 !important; padding: 15px 15px 10px !important; box-sizing: border-box !important; text-align: center !important; } .tokusetsu .item .box img { display: block; width: 100%; height: auto; cursor: -webkit-zoom-in; cursor: zoom-in; } .tokusetsu .item .box img:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: alpha(opacity=70); } /*----------------------------------------------- 商品名 -----------------------------------------------*/ .tokusetsu .item .ttl { font-size: 16px !important; font-weight: 600; line-height: 1.4 !important; margin: 0 15px !important; } .tokusetsu .item .ttl a { color: #6296c1; text-decoration: underline !important; word-wrap:break-word; } .tokusetsu .item .ttl a:hover { color: #6296c1 !important; text-decoration: none !important; opacity: 0.8; filter: alpha(opacity=70); -ms-filter: alpha(opacity=70); cursor: pointer; word-wrap:break-word; } /*----------------------------------------------- NEWラベル -----------------------------------------------*/ .newmark { background-color: #ed143d; padding: 8px 16px; position: relative; margin: 0 auto; width: calc(50% - 20px); } .newmark:after { content: "NEW"; font-size: 14px; color: #ffffff; } .tokusetsu .item.new:after { display: inline-block; position: absolute; top: 16px; left: 6px; color: #fff; font-size: 1.4em; font-size: 14px !important; font-weight: 600; padding: 2px 18px 3px !important; background-color: #e51c23; transform: rotate(-15deg); content: "NEW!!"; z-index: 3; } /*----------------------------------------------- 価格とカートボタン枠 -----------------------------------------------*/ .tokusetsu .item .bottom { margin: 0 !important; margin-top: auto !important; } /*----------------------------------------------- 価格 -----------------------------------------------*/ .tokusetsu .item .price { font-size: 13px !important; font-weight: 500; color: #FFFFFF !important; background-color: #231815 !important; margin: 10px 0 12px !important; padding: 7px 0 10px !important; letter-spacing: 1px; } .tokusetsu .item .price span { font-size: 22px !important; margin: 0 0 0 5px !important; } .tokusetsu .item .price:after { display: inline-block; margin: 0 0 0 3px !important; font-size: 1.0em; font-size: 10px !important; content: "(税込)"; } /*----------------------------------------------- 購入ボタン -----------------------------------------------*/ .tokusetsu .item .cart { display: inline-block; font-size: 15px; font-weight: 700; text-decoration: none !important; } .tokusetsu .item .cart span { color: #231815 !important; } .tokusetsu .item .cart span:hover { color: #ffcb66 !important; cursor: pointer; } .tokusetsu .item .cart:before { display: inline-block; font-size: 20px; font-weight: 600; margin-right: 7px !important; font-family: FontAwesome; content: "\f07a"; color: #231815 !important; } .tokusetsu .item .cart:hover:before { color: #ffcb66 !important; } /*----------------------------------------------- more -----------------------------------------------*/ .tokusetsu .more { width: calc(100% - 150px); margin: 30px auto; } .tokusetsu .more a:hover { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: alpha(opacity=80); } .tokusetsu .more p + p { margin-top: 20px; } .tokusetsu .more .btn_twitter a, .tokusetsu .more .btn_nicovideo a { display: block; position: relative; font-size: 2.0em !important; font-size: 20px !important; font-weight: 500; text-align: center; border-radius: 50px; box-shadow: 0 0 15px 0 rgb(0 0 0 / 30%); } .tokusetsu .more .btn_twitter a { background-color: #3e8eed; color: #FFFFFF !important; line-height: 70px; text-decoration: none; } .tokusetsu .more .btn_nicovideo a { background: #ffcb66; color: #231815 !important; padding: 20px 0; line-height: 30px; text-decoration: none; } .tokusetsu .more .btn_twitter a:after, .tokusetsu .more .btn_nicovideo a:after { display: inline-block; position: absolute; right: 20px; font-size: 22px !important; font-family: FontAwesome; pointer-events: none; content: "\f0da"; } /*----------------------------------------------- footer -----------------------------------------------*/ .tokusetsu .footer { height: 20px; margin-top: 0 !important; text-align: center; } .tokusetsu .footer p { color: #fff !important; font-size: 1em; font-size: 10px !important; line-height: 45px !important; } .tokusetsu .footer p:before { display: inline-block; margin-right: 3px !important; font-family: FontAwesome; content: "\f1f9"; } /*----------------------------------------------- backtop -----------------------------------------------*/ .tokusetsu .backtop { position: fixed; z-index: 333; bottom: 10px; right: 10px; } .tokusetsu .backtop a { display: block; position: relative; width: 60px; height: 60px; background: #231815; color: #fff!important; text-align: center; -webkit-border-radius: 50%; -ms-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .tokusetsu .backtop a:hover { opacity: 0.7; filter: alpha(opacity=70); -ms-filter: alpha(opacity=70); } .tokusetsu .backtop i { margin: 13px auto 0 !important; font-size: 4em; } /*----------------------------------------------- overlay -----------------------------------------------*/ .tokusetsu .overlay { display: none; background: rgba(0, 0, 0, 0.8); position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; } .tokusetsu .overlay_box { width: 100%; z-index: 9999; } .tokusetsu .overlay img { position: fixed; top: 50%; left: 50%; max-width: 600px; max-height: 600px; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); z-index: 9999; }