@charset "utf-8"; /* CSS Document */ /* [170221] 画面の高さ100%を取る為、に質量(H:100%)を指定する http://qiita.com/shouchida/items/205fed63b886681661bd ------------------------------------------------------ [161207]IE hack削除 */ /* ====================================================== ★★★　全デバイス共通・1　★★★ @import"../css/test_line.css"; ====================================================== */ * { -webkit-box-sizing: border-box; /* Webkit系用 */ -moz-box-sizing: border-box; /* Firefox用 */ box-sizing: border-box; /* 標準 */ hyphens: manual; } html { width:100%; height:100%; } /* font-size: 62.5%; */ /* 2016-17年最強の Font Family 設定 [ゴシック体] https://www.mirucon.com/2016/01/01/2016-font-family/ */ body, form,fieldset,input,textarea,button { font-weight: normal; font-family: -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック Medium', meiryo, sans-serif; text-align:center; letter-spacing: 2px; line-height: 2; width:100%; height:100%; } /* font-family:"ＭＳ Ｐゴシック", "メイリオ", "ヒラギノ角ゴ Pro W3", "Meiryo", "osaka", "Hiragino Kaku Gothic Pro W3", "sans-serif"; ナール font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"; */ /* [160910] PC以外で余白にゴーストが出るのを防ぐ ※fixed非対応 */ @media screen and (max-width: 800px) { body { background-attachment: scroll; } } body { font-size: 1rem; font-size: 1.8vw; } table, form,fieldset,input,textarea,button { font-size: inherit; } table {line-height: inherit;} button { letter-spacing: 0px; } .Main article { margin-bottom: 1.5rem; } .Wrap, #Document, .Contents, .Main, .Main>div { height: 100%; } body>.Wrap { height: 100vh; } /* ====================================================== swf・映像の振り分け　(PC用) ------------------------------------------------------ */ #TopFlash .VideoSWF, #MovieFlash .VideoSWF {} #TopFlash .VideoSP, #MovieFlash .VideoSP { display: none; } /* ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ ------------------------------------------------------ */ /* ------------------------------------------------------ 背景・基本 */ /* [211224]修正　白黒反転 */ /* body, thead th, .RootShowListHeader { background-color: #1B1E20; background-color: rgba(255,255,255,1.0); background-color: #2f3a4a; background-color: rgba(27,30,32,1.0); background-color: rgba(26,33,33,1.0); } #Header, .FooterBtn { background-color: rgba(255,255,255,0.8); background-color: rgba(27,30,32,0.8); background-color: rgba(26,33,33,1.0); } */ .SortNavi b { background-color: rgba(33,34,34,0.3); color: rgba(255,255,255,1.0); } .SortNavi a, .SortNavi a:hover { background-color: rgba(33,34,34,0.1); color: inherit; } /* 背景・濃い */ /* 背景・薄い */ /* #RootShow td { background-color: rgba(255,255,255,0.3); } #RootShow .DspOFF td { background-color: rgba(255,255,255,0.0); } */ .zebra>tr>th, .zebra>tr>td, .MarkerPen { background-color: rgba(0,0,0,0.075); } /* 斜線 */ .Slat20 { background-image: url(../img/slat20_w30.png); } .Slat30 { background-image: url(../img/slat_w30.png); } /* ------------------------------------------------------ 文字色・基本 */ /* [211224]修正　白黒反転 */ /* body, .RootShowList a/ [170817]校正・リストの白文字 / { color: rgba(0,0,0,1.0); color: rgba(255,255,255,0.9); } */ a { color: rgba(240,131,0,1.0); } /* 文字色・濃い */ /* OR #01A49E / rgba(240,131,0,1.0)*/ /* 文字色・薄い */ /* GR #F08300 / rgba(1,164,158,1.0) */ .icon_error-triangle, .ui-dialog-title:before { color: rgba(250,190,22,1.0); } /* ------------------------------------------------------ 線・基本 */ /* [211224]修正　白黒反転 */ body, hr, a, img, div, p, blockquote, strong, span, b, small, em, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, table, th, td, caption, thead, tbody, tfoot, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, .Border, *:before, *:after { border-style: solid; border-color: rgba(0,0,0,0.3); border-width: 0px; } /* body, hr, a, img, div, p, blockquote, strong, span, b, small, em, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, table, th, td, caption, thead, tbody, tfoot, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, .Border, *:before, *:after { border-style: solid; border-color: rgba(255,255,255,0.5); border-width: 0px; } */ .Corner, .Corner>.Wrap { border-color: rgba(0,0,0,0.2); } /* 線・濃い */ .read.Corner, .read.Corner>.Wrap { border-color: rgba(215,10,48,0.2); } /* 線・薄い */ .ColorBtn { border-color: rgba(0,0,0,1.0); } /* リーダー・線 */ /* .LeaderLine { background-image: url(../img/leader.png); background-repeat: no-repeat; background-position: center center; } */ /* ------------------------------------------------------ 線で囲む */ .memo, .Border { border-width: 1px; padding: 1em; margin-top: 1.5rem; margin-bottom: 1.5rem; } /* [160924]追加　内側へ線を引く */ .BorderInside { position: relative; display: block; } .BorderInside:after { content:""; position:absolute; top:0px; right:0px; bottom:0px; left:0px; box-shadow:inset 0px 0px 0px 1px rgba(113,126,121,0.5); } /* 下線 */ .Under1 { text-decoration: underline; } /* .Under2 { background-repeat: repeat-x; background-position: center bottom; background-image: url(../img/line2.png); padding-bottom: 2px; padding-top: 2px; } */ /* テープ */ .Tape { color: rgba(255,255,255,1.0); border-width: 1px 0; border-color: rgba(255,255,255,1.0); padding: 2px 0; } .Tape { background-color: rgba(255,255,255,0.5); } .Tape:before, .Tape:after { content: ""; display: block; border-style: dotted; border-color: rgba(255,255,255,1.0); padding: 0.25em; } .Tape:before { border-top-width: 1px; } .Tape:after { border-bottom-width: 1px; } /* ====================================================== 画像 ------------------------------------------------------ */ img { letter-spacing: 0px; } .Main img { border-style: solid; border-width: 0px; border-color: rgba(255,255,255,1.0); } /* ------------------------------------------------------ 写真にフチをつける */ /* .Snap { text-align: center; } */ .Snap img { border-width: 5px; box-shadow: 0px 0px 5px rgba(0,0,0,1.0); -moz-box-shadow: 0px 0px 5px rgba(0,0,0,1.0); -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,1.0); } /* ------------------------------------------------------ トリミング */ .Trimming { overflow: hidden; position: relative; } .Trimming img { position: absolute; } .Main .ImgBorderNone img { border-width: 0px; } /* ------------------------------------------------------
*/ hr { border-style: solid; border-width: 0px; border-color: rgba(255,255,255,1.0); height: 1px; margin-top: 2rem; margin-bottom: 2rem; /* background-image: url(../img/line_dot.png); background-repeat: repeat-x; background-position: left center; */ } /*
*/ address { font-style: normal; } address img { margin-bottom: 0.5rem; } /* ------------------------------------------------------
*/ .Main section { margin-top:5rem; } .Main h1>section, .Main section:first-child { margin-top: 0; } .Contents .Wrap { margin: 1em 0 0; } body>.Wrap { } .Main>.Wrap { margin: 0; position: relative; } .Note { margin-left: 2em; } .ExternalSet ul { margin-left: 0px; list-style: none; } .ExternalSet span { display: inline-block; vertical-align: middle; margin-left: 1em; } .ExternalSet img { display: inline-block; vertical-align: middle; height: 3em; } /* ====================================================== 文字 ------------------------------------------------------ */ .Main h1 {} .Main h2 {} .Main h3 {} .Main h4, .Main dt {} .Main h1 img, .Main h1 span img, .Main h2 img, .Main h2 span img, .Main h3 img, .Main h3 span img, .Main h4 img, .Main h4 span img { border-width: 0; vertical-align: middle; } h1 .r, h2 .r, h3 .r, h4 .r, .Main h1 .r, .Main h2 .r, .Main h3 .r, .Main h4 .r { display: block; font-weight: normal; font-size: 1.2rem; } .Main h1 span a.mark, .Main h2 span a.mark, .Main h3 span a.mark, .Main h4 span a.mark { text-decoration: none; } .FormBtn { background-color: #000; color: #fff; text-align: center; padding: 1em 0; } sup.Required, sub.Required, .Required:before, .Required:after, .Alert, .ErrorMessage { color: #c33; } .Required::after { background-color: #c33; color: #fff; } .Alert {} .ErrorMessage {} th .ErrorMessage { color: #fff; } .message { text-align: center; margin-top: 5rem; margin-bottom: 5rem; } .message input { margin-top: 5rem; margin-bottom: 5rem; } .MarkerPen {} /* アイコン */ .NewMark { font-size: 0.8em; color: #df9537; } .Icon:before { display: inline-block; font-size: 1rem; vertical-align: middle; padding: 0.25em; letter-spacing: 0px; padding-left: 0.5em; padding-right: 0.5em; border-radius: 2px; } .IconSoldOut:before { content: "SOLD OUT"; } /* ------------------------------------------------------ 点滅 */ .blinking { -webkit-animation:blink 1.0s ease-in-out infinite alternate; -moz-animation:blink 1.0s ease-in-out infinite alternate; animation:blink 1.0s ease-in-out infinite alternate; } @-webkit-keyframes blink { 0% {opacity:0;} 100% {opacity:1;} } @-moz-keyframes blink { 0% {opacity:0;} 100% {opacity:1;} } @keyframes blink { 0% {opacity:0;} 100% {opacity:1;} } /* ====================================================== */ /*a img { vertical-align: middle; } */ a, .changeBtn span { text-decoration:underline; text-decoration:none; border-width:0; display: block; } a:hover, .changeBtn span:hover, .ColorBtn a, .Header a, #MenuBar a, .PageNavi span { text-decoration:none; border-width: 0; } .PageNavi span:after { content: "　>　"; display:inline; text-decoration: none; } /* a:before { content: ">> "; display:inline; letter-spacing: 0px; font-size: 0.8em; } .HeaderLogo a:before, #MenuBar a:before, .PageNavi a:before, .FooterMenu li ul a:before, .FooterCopy a:before { content: none; } */ /* ------------------------------------------------------ ボタン風 */ .Marker { text-decoration: none; padding: 0.25em 0.5em; border-width: 1px; /* background-image: url(../img/bg_pnk.png); background-repeat: repeat-x; background-position: left top; background-color: #f2dbdf; */ } a img.Marker, input.Marker { border-width: 1px; border-style: solid; border-color: #e4b7bf; padding: 5px 4px 3px; background-attachment: fixed; } /* ====================================================== ------------------------------------------------------ */ table, th, td { } table { border-collapse:collapse; text-indent: 0px; text-align: left; border-top-width: 1px; } .Main table { margin-bottom: 1.5em; } .Main table:last-child { margin-bottom: 0em; } .Main .RootShowList { table-layout:fixed; margin-bottom: 0em; } caption { text-align:left; font-weight: bold; } caption span { font-weight: normal; } tr { } th, td { text-indent: 0px; vertical-align: middle; border-bottom-width: 1px; padding: 0.5em 0em; /* border-width: 0 1px 1px 0; border-style: dotted; background-image: url(../img/line1.png); background-repeat: no-repeat; background-position: left bottom; */ } th, .WidthTh { width: 10em; width: 11em\9; /* IE hack */ text-align: left; vertical-align:middle;/* background-color: rgba(0,0,0,0.75); background-size: 100%; */ } .Main th {} /* 幅自由の
*/ .ThAuto th { width: auto; } td { padding-left: 1em; } .Main td { } .Main th table, .Main td table { border-collapse:inherit; background: none; } .Main td th, .Main td td { border-width: 0; background: none; } /* 装飾は引き継ぎつつ .TableSimple, .TableSimple table, .TableSimple th, .TableSimple td, .Main .TableSimple, .Main .TableSimple table, .Main .TableSimple th, .Main .TableSimple td { } */ .ie6 th, .ie7 th, .ie8 th, .ie9 th {width: 13em;} th span { font-weight: normal; } .Main thead th, .Main thead td, .Main tfoot th, .Main tfoot td { border-width: 2px 0px; border-style: solid; text-align: center; } .Main thead th { padding-left: 0.5em; padding-right: 0.5em; } tbody th:first-child, tbody td:first-child { padding-left: 0px; } thead th:first-child, thead td:first-child, tfoot th:first-child, tfoot td:first-child { border-left-width: 0; } thead th:last-child, thead td:last-child, tfoot th:last-child, tfoot td:last-child { border-right-width: 0; /* border-top-width: 0; */ } /* .Main thead th, .Main thead td { border-style: solid; } .Main tfoot th, .Main tfoot td { border-style: solid; } */ /* センター揃、センター揃えの中の */ .TableCenter { text-align: center; } .TableCenter table { width: auto; margin-left: auto; margin-right: auto; text-align: center; } /* 左揃えの中の
*/ .l table { width: auto; margin-left: 0px; margin-right: auto; } /* 右揃えの中の
*/ .r table { width: auto; margin-left: auto; margin-right: 0px; } /* 幅自由の
*/ .TableAuto, .TableAuto table, .TableAuto th, .TableAuto td { width: auto; } /* 幅自由の
・中揃え */ .TableAutoCenter { margin-left: auto; margin-right: auto; } .TableAutoCenter, .TableAutoCenter table, .TableAutoCenter th, .TableAutoCenter td { width: auto; } /* 幅自由の
・左揃え */ .TableAutoLeft { width: auto; margin-left: 0; margin-right: auto; } .TableAutoLeft, .TableAutoLeft table, .TableAutoLeft th, .TableAutoLeft td { width: auto; } /* 幅自由の
・右揃え */ .TableAutoRight { width: auto; margin-left: auto; margin-right: 0; } .TableAutoRight, .TableAutoRight table, .TableAutoRight th, .TableAutoRight td { width: auto; } /* 線を消す */ .TableNoLine, .TableNoLine table, .TableNoLine th, .TableNoLine td, .TableNoLine thead, .TableNoLine thead th, .TableNoLine thead td .TableNoLine tfoot, .TableNoLine tfoot th, .TableNoLine tfoot td { border-width: 0; } .TableNoLine td { padding-left: 0px; } /* 背景を消す */ .TableNoBg, .TableNoBg table, .TableNoBg th, .TableNoBg td { background-image: none; background-color: transparent; background-color: none; } /* 価格セル */ .TablePrice td { text-align: center; vertical-align: middle; } .TdPrice, .Main tfoot .TdPrice { white-space: nowrap; text-align: right; } /* 時間 */ .TdTime { white-space: nowrap; text-align: center; } /* 単位(円だけとか) */ .TdUnit { padding-left: 0px; padding-right: 0px; } /* 線を入れる */ .TableLine, .TableLine table, .TableLine th, .TableLine td { border-width: 1px; } .TableLine thead th, .TableLine thead td, .TableLine tfoot th, .TableLine tfoot td { border-width: 2px 1px; } /* 線を入れる・破線 */ .TableLine.BorderStyleDashed th, .TableLine.BorderStyleDashed td { border-style: solid dashed; } /* 線を入れる・点線 */ .TableLine.BorderStyleDotted th, .TableLine.BorderStyleDotted td { border-style: solid dotted; } /* 装飾は引き継ぎつつ .TableSimple, .TableSimple table, .TableSimple th, .TableSimple td, .Main .TableSimple, .Main .TableSimple table, .Main .TableSimple th, .Main .TableSimple td { } */ /* レイアウトとして使う */ .TableLayout, .TableLayout table, .TableLayout th, .TableLayout td, .Main .TableLayout, .Main .TableLayout table, .Main .TableLayout th, .Main .TableLayout td { padding: 0px; border-width: 0; vertical-align: top; background-image: none; background-color: none; background-color: transparent; width: auto; height: auto; margin-top: 0px; margin-bottom: 0px; color: inherit; } .TableLayout, .TableLayout table, .Main .TableLayout, .Main .TableLayout table { border-collapse: collapse; border-spacing: 0; } .TableLayout th:first-child, .Main .TableLayout th:first-child { padding-left: 0px; } /* 必須項目 */ /* 前に表示 */ .TableRequired th { padding-left: 1.5em; } th.Required { text-indent: -1em; } .Required::before { content: "※"; display: inline; font-weight: normal; line-height: 1.1; padding-right: 0.25em; letter-spacing: 0; } th.Required::before { font-size: 0.75em; vertical-align: super; } /* 後ろに表示 .Required::after { content: "必須"; display: inline-block; vertical-align: super; font-size: smaller; font-size: 0.8em; font-weight: normal; line-height:1.5; letter-spacing: 0; white-space: nowrap; margin-left: 0.5em; margin-right: 0.5em; width: 2.5em; text-indent:0; text-align:center; } th.Required::after { vertical-align: super; font-size: smaller; } */ /* 共通 */ sup.Required::before, sup.Required::after { vertical-align: middle; /* display: inline; padding-right: 0.25em; */ } /* シマシマ */ .zebra>tr>th, .zebra>tr>td { } .Stripe th, .Stripe td, .Stripe thead th, .Stripe thead td, .Stripe tfoot th, .Stripe tfoot td { padding-left: 0.5em; padding-right: 0.5em; } /* 等幅 */ .TableNameList tbody td { font-family: monospace; font-size: 101%; } /*
,
#Header table, #Header th, #Header td, #Footer table, #Footer th, #Footer td { background: none; border-width: 0; padding: 0; width: auto; } */ /* 縦複数列の
*/ .TateThAuto th { vertical-align: middle; width: 8em; } .TateThAuto th.TateThAutoTitle { width: 1em; line-height: 1.2; text-align: center; padding: 0 1em; } /* ======================================================
*/ .Main dt {} .Main dt a { font-size: 1.4rem; font-weight: normal; padding-left: 1em; } /* ======================================================
*/ select, nput, textarea { /* background-color: #3a7dda; color: #fff; border-color: #dcdddd; background-color: #fff; border-style: solid; border-width: 1px; */ } input[type="button"] { } input[type="file"] { border-width: 0; padding: 0; background: none; } select { width: 100%; padding-top: 0.5em; padding-bottom: 0.5em; } option { padding: 1px; } option { font-size: 0.9em; } input.Marker { border-width: 0; } /* 色+画像ボタン */ .ColorBtn { display: inline-block; background-color: rgba(255,255,255,0.5); padding: 0.75em 1em; color: inherit; font-weight: inherit; /* border-width: 1px; */ } .ColorBtn a { text-decoration: none; color: inherit; } .ColorBtn input { width: auto; border-width: 0; background: none; } .ColorBtn img { width: auto; height: auto; margin: 0; padding: 0; } .InputS { width: 5em; height: 5em; text-align: center; } /* ====================================================== lightbox用 ------------------------------------------------------ */ #imagelightbox { position: fixed; z-index: 9999; -ms-touch-action: none; touch-action: none; } /* ====================================================== クリップ ------------------------------------------------------ */ .Clip { position: relative; margin-top: 2rem; margin-bottom: 2rem; background-image: url(../img/bg.png); border-width: 0 1px 1px 0; padding: 1rem 3rem; /* border-width: 0 1px 1px 0; background-color: #fff; */ } .Clip:before { content: url("../img/mark_clip.png"); display:block; position: absolute; left: 3px; top: -3px; } /* ====================================================== ====================================================== ====================================================== ====================================================== ====================================================== */ /* 非表示 */ .DspNo { display: none; width: 0px; height: 0px; overflow: hidden; border-width: 0; background: none; } /* 表示OFF */ .DspOFF { /* color: rgba(255,255,255,0.8); background-color: rgba(255,255,255,0.2); */ opacity: 0.6; } /* ====================================================== box ------------------------------------------------------ */ .box { zoom: 1; } .box:after { content: ""; display: block; clear: both; } .box {margin-bottom:0;}