@charset "utf-8"; /*================================================= * ブラウザのデフォルトのスタイルをリセットする * ================================================= */ @import url(https://fonts.googleapis.com/css?family=Parisienne|Niconne|Allura); html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, header, hgroup, section, article, aside, hgroup, footer, figure, figcaption, nav { margin: 0; padding: 0; font-size: 100%; } body { line-height: 1.0; -webkit-text-size-adjust: none; } article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } img { border: 0; vertical-align: bottom; } ul, ol { list-style: none; } table { border-spacing: 0; empty-cells: show; } button { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: top; font-style: normal; background: transparent; list-style: none; } /*================================================= * サイト全体の基本スタイル * ================================================= */ body { color:#403f41; /*background-color: #FFFFFF;*/ background: #F4F4EC none 0 0 no-repeat; font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif; /*line-height: 1.6;*/ line-height: 1.4; font-size: 12px; -webkit-text-size-adjust: none; } #container { overflow: hidden; width: 100%; margin: 0 auto; background: #FFFFFF; position:relative; padding-top:52px; } /* #container { overflow: hidden; width: 320px; margin: 0 auto; background: #FFFFFF; position:relative; padding-top:52px; } @media all and (orientation: landscape) { #container { width: 100%; } } */ a { -webkit-tap-highlight-color: rgba(200,200,555,.6); } a:link { text-decoration: none; color: #0A96D7; } a:visited { text-decoration: none; color: #0A96D7; } em { font-style: normal; } /* img:not([width]) { zoom: 0.5; } */ input[type="text"], input[type="email"], input[type="tel"], input[type="number"] { border: 1px solid #999; outline: 0; padding: 0; line-height: 1.8; font-size: 14px; background: -webkit-border-radius :4px; padding: 0;-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(55%,#ffffff)); background: -webkit-linear-gradient(top, #eeeeee 0%,#ffffff 55%); } input[type="password"] { border: 1px solid #999; outline: 0; padding: 0; line-height: 1.8; font-size: 14px; background: -webkit-border-radius :4px; padding: 0;-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(55%,#ffffff)); background: -webkit-linear-gradient(top, #eeeeee 0%,#ffffff 55%); } select { outline: 0; border: 1px solid #999; line-height: 1.8; font-size: 14px; -webkit-border-radius: 4px; vertical-align: baseline; } textarea { border: 1px solid #999; outline: 0; padding: 0; line-height: 1.8; font-size: 14px; padding: 0; } label { display: inline-block; line-height: 1.4; vertical-align: baseline; } label a, label em, label span { vertical-align: baseline; } label input { vertical-align: baseline; line-height: 1.4; position: relative; top: 1px; } /* parts --------------------------------------------------------- */ .m00 { margin: 0 !important; } .m10 { margin: 10px !important; } .mb00 { margin-bottom: 0 !important; } .mb05, .mb5{ margin-bottom: 5px !important; } .mb10 { margin-bottom: 10px !important; } .mb15 { margin-bottom: 15px !important; } .mb20 { margin-bottom: 20px !important; } .mb30 { margin-bottom: 30px !important; } .mb40 { margin-bottom: 40px !important; } .mb50 { margin-bottom: 50px !important; } .mt10n { margin-top: -10px !important; } .mt00 { margin-top: 0 !important; } .mt5 { margin-top: 5px !important; } .mt10 { margin-top: 10px !important; } .mt15 { margin-top: 15px !important; } .mt20 { margin-top: 20px !important; } .mt25 { margin-top: 25px !important; } .mt30 { margin-top: 30px !important; } .mt35 { margin-top: 35px !important; } .mt40 { margin-top: 40px !important; } .ml00 { margin-left: 0 !important; } .ml5 { margin-left: 5px !important; } .ml10 { margin-left: 10px !important; } .mr00 { margin-right: 0 !important; } .mr5 { margin-right: 5px !important; } .mr10 { margin-right: 10px !important; } .mlr00 { margin-left: 0 !important; margin-right: 0 !important; } .mlr10 { margin-left: 10px !important; margin-right: 10px !important; } .p10{ padding:10px !important; } .w0 { width: 100% !important; } .w98 { width: 98% !important; } .tl { text-align: left !important; } .tc { text-align: center !important; } .tr { text-align: right !important; } .fl { float: left !important; } img.fl { padding: 0 10px 10px 0; } .fr { float: right !important; } img.fr { padding: 0 0 10px 10px; } .sl { font-size: 130% !important; } .slm { font-size: 115% !important; } .sm { font-size: 100% !important; } .sms { font-size: 90% !important; } .ss { font-size: 80% !important; } .bn { border: none !important; } .font10{ font-size: 10px !important; } .font11{ font-size: 11px !important; } .font12{ font-size: 12px !important; } .font13{ font-size: 13px !important; } .font14{ font-size: 14px !important; } .font15{ font-size: 15px !important; } .font16{ font-size: 16px !important; } .font17{ font-size: 17px !important; } .font18{ font-size: 18px !important; } .font19{ font-size: 19px !important; } .font20{ font-size: 20px !important; } .font_Parisienne{ font-family: 'Parisienne', cursive; } .font_Niconne{ font-family: 'Niconne', cursive; } .font_Allura{ font-family: 'Allura', cursive; } .clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clear { * zoom: 1; } .jidume1{ letter-spacing: -1px !important; } .jidume2{ letter-spacing: -2px !important; } .totu{ text-indent:-1em; padding-left:1em; } /* color */ .blue { color: #0a96d7 !important; } .gray { color: #616162 !important; } .orange { color: #ff6400 !important; } .red { color: #FF0000 !important; } .red1{ color: #FF5555 !important; } .maz{ color: #E61773 !important; } .green_blue{ color:#00aba8 !important; } .beige{ color:#cdc1a5 !important; } .float_off{ display: block; clear: both; height: 0px; font-size: 0px; line-height: 0px; margin: 0px; padding: 0px; overflow: hidden; } /* ------------------------------------------------------- * サイトヘッダー * ------------------------------------------------------- */ #global-header{ position:absolute; top:0; left:0; padding:0; width: 100%; border-top:2px solid #9c844c; z-index:100; } #global-header table{ width: 100%; border-spacing:0; border-collapse:collapse; } #global-header table td{ width:50%; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/head_bg01.png) repeat-x left top; background-size:1px 57px; height:47px; padding:10px 0 0 8px; vertical-align: top; } #global-header table td:last-child{ background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/head_bg02.gif) no-repeat right top,url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/head_bg01.png) repeat-x left top; background-size:107px 49px,1px 57px; } #global-header table td a{ float:left; display:block; width:32px; text-align:center; font-size:10px; color:#403f41; } #global-header table th{ width:70px; padding:0; } #menu_list_head{ background:#e5f6f6; padding:76px 0 0; position:absolute; top:0; left:0; width:100%; z-index:90; } #menu_list_head a{ display:block; height:40px; padding:0 15px; color:#58595b; border-bottom:1px solid #ccc; } #menu_list_head a span{ display:block; height:40px; line-height:40px; padding:0; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/menu_list_head_arrow.gif) no-repeat right center; background-size:6px; } #menu_list_head div{ display:block; height:40px; line-height:40px; padding:0; text-align:center; color:#fff; background:#3c2f2d; font-size: 14px; } #menu_list_head div img{ vertical-align:-4px; padding-right:6px; } /* ------------------------------------------------------- * サイトヘッダー(TOP以外) * ------------------------------------------------------- */ /* ------------------------------------------------------- * ヘッダーナビゲーション * ------------------------------------------------------- */ /* ------------------------------------------------------- * セクション、見出し * ------------------------------------------------------- */ .midasi_gold{ padding-bottom:12px; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/shadow_circle.png) no-repeat left bottom; background-size:100% 12px; } .midasi_gold p{ padding:10px; text-align:center; background:#9c844c; color:#fff; font-size:12px; } .midasi_gold p span{ color:#c8bb9c; font-weight:normal; } .midasi_head{ height:9px; width:100%; background: url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/top/bg_check_top.gif) repeat-x left top; background-size:32px 9px; } /* ------------------------------------------------------- * タブ * ------------------------------------------------------- */ /* ------------------------------------------------------- * フッターナビゲーション * ------------------------------------------------------- */ #foot_menu{ background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/bg_footmenu.gif) repeat-x left bottom #3c2f2d; background-size:32px; border-top:1px solid #aa9767; height:86px; width:100%; margin-top:30px; } #foot_menu ul{ width:100%; margin-top: -15px; } #foot_menu ul li{ width: 25%; text-align: center; float: left; padding: 0; font-size: 10px; line-height: 20px; } #foot_menu ul li img{ width:64px; } #foot_menu ul li a{ color:#e1dac9; } /* ------------------------------------------------------- * サイトフッター * ------------------------------------------------------- */ #global-footer nav{ background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/bg_beige_check.gif) repeat left top; background-size:3px; padding:10px 10px 20px; } #global-footer nav ul{ padding:0; margin:5px 0 15px; border:1px solid #a6915e; border-radius:5px; } #global-footer nav ul li{ border-bottom:1px solid #a6915e; background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(5%,#f0f0f0), color-stop(50%,#f2f2f2), color-stop(100%,#ffffff)); background-image: -moz-linear-gradient(top,#ffffff 0%,#f0f0f0 5%,#f2f2f2 50%,#ffffff); padding:0 10px 0 0; } #global-footer nav ul li:first-child{ border-radius:4px 4px 0 0; } #global-footer nav ul li:last-child{ border-bottom:none; border-radius:0 0 4px 4px; } #global-footer nav ul li a{ display:block; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/menu_arrow_right.png) no-repeat right center; background-size:6px; padding:0 0 0 10px; height:50px; line-height:50px; color:#58595b; position:relative; } #global-footer nav ul li a img{ position:absolute; width: 27px; top: 12px; left: 9px; } #global-footer nav ul li a p{ padding:0 0 0 30px; } #global-footer div.tel{ padding:10px 0 5px 40px; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/common/tel_ico.png) no-repeat 10px 10px #19b4b1; background-size:20px; color:#fff; } #global-footer div.tel a{ font-size:20px; display:block; font-family:serif; font-weight:bold; color:#fff; } #global-footer .copy{ display:block; height:25px; line-height:25px; padding:0; text-align:center; color:#fff; background:#3c2f2d; font-size: 11px; } /* ---------------------------------------------------------------- ボタンセット ----------------------------------------------------------------- */ a.btn_gold{ display:block; padding:2px; border-radius:6px; background:#3c2f2d; } a.btn_gold p{ display:block; border:1px solid #aa9767; border-radius:5px; background:#3c2f2d; position:relative; height:45px; line-height:45px; padding:0 15px 0; color:#a59262; font-size:14px; font-weight:bold; } a.btn_gold p img{ position:absolute; top:15px; right:15px; width: 16px; zoom: 1; } a.btn_gold2{ display:block; padding:2px; border-radius:6px; background:#3c2f2d; } a.btn_gold2 p{ display:block; border:1px solid #aa9767; border-radius:5px; background:#3c2f2d; position:relative; height:40px; padding:5px 15px 0; color:#a59262; font-size:14px; font-weight:bold; } a.btn_gold2 p img{ position:absolute; top:15px; right:15px; width: 16px; zoom: 1; } a.btn_gold2 p small{ display:block; padding:1px 0px 0; color:#fff; font-size:12px; font-weight:normal; } a.btn_beige{ display:block; padding:2px; border-radius:6px; background:#af9d6f; } a.btn_beige p{ display:block; border:1px solid #fff; border-radius:5px; background:#af9d6f; position:relative; height:45px; line-height:45px; padding:0 15px 0; color:#fff; font-size:14px; font-weight:bold; } a.btn_beige p img{ position:absolute; top:15px; right:15px; width: 16px; zoom: 1; } a.btn_beige.li2 p{ height:40px; padding:5px 15px 0; line-height:1.4em; } .btn_table td.btn_space{ width:5px; } .btn_table{ width:100%; } .btn_table td{ width:49%; } .btn_table td a p{ font-size: 13px; } /* pagenation */ /* ---------------------------------------------------------------- 共通部分 ----------------------------------------------------------------- */ .bg_flower{ background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/beachphoto/bg_flower.gif) no-repeat left top; background-size:320px 115px; padding:1px 0; } .bg_flower h2.bg_plan_title{ margin:36px 0 0px; padding:10px 0; background:url(https://www.exeojapan.com/ssl/royalkaila/s/static/img/beachphoto/bg_plan_title.png) no-repeat center center; background-size:292px 56px; font-size:18px; text-align:center; font-family: serif; color:#98824b; } .bg_flower .point{ padding:0 0 4px; border-bottom:1px solid #cfcfcf; margin-bottom:5px; } .bg_flower .point img{ width: 68px; zoom: 1; } /* LINEに送る */ .linebutton { margin: 10px; float: right; } /* 2014/12/12 追加(価格切り替え用) */ .hide{ display: none; } .exchange_button{ margin: 0px 5px 10px 0px; } .exchange_button p{ clear: both; position: relative; float: right; width: 170px; padding: 5px 0px 5px 10px; margin: 0px; background: #9c844c; border-radius: 4px; } .exchange_button p a{ display: inline-block; font-size: 12px; line-height: 15px; width: 70px; padding: 1px 0px 0px 0px; margin: 0px 8px 0px 0px; border: 1px solid #DCB48C; color: #DCB48C; text-align: center; border-radius: 3px; } .exchange_button p a:hover, .exchange_button p a.on{ color: #9c844c; background: #FFF; text-decoration: none; } #season{ display: none; position: absolute; z-index: 500; width: 30%; height: 40px; right: 3%; top: 22px; margin: 0; overflow: hidden; } #season.xmas{ display: block; background: url(../img/common/season_xmas.png) no-repeat left top; background-size: 125px; } #season.newyear{ display: block; background: url(../img/common/season_newyear.png) no-repeat left top; background-size: 125pc; }