@charset "UTF-8";
/*------ 画像のパスを設定 ------*/
/*------ webフォントの設定 ------*/
@import url(http://fonts.googleapis.com/css?family=Oswald);
/*------ サポートブラウザの定義 ------*/
/*------ テーマ設定 ------*/
/*---------- link color ----------*/
a:link,
a:visited {
  color: #fff;
  text-decoration: none;
  -webkit-touch-callout: none; }

a:hover,
a:active {
  text-decoration: none;
  color: #ef0447; }

/*---------- html ----------*/
html {
  height: 100%;
  min-height: 100%; }

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/*---------- body ----------*/
body {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100%;
  min-height: 100%;
  color: #000;
  line-height: 1.5;
  font: 13px/1.231 Helvetica, Arial, "ヒラギノ角ゴ ProN", "Hiragino kakugo ProN", "モリサワ 新ゴ R", "Droid Sans", メイリオ, "sans-serif";
  *font-size: small;
  *font: x-small;
  background: #000;
  -webkit-text-size-adjust: none; }

article, aside, details, figcaption, figure,
footer, header, hgroup, nav, section, address {
  display: block; }

table {
  font-size: inherit;
  font: 100%;
  line-height: 1.5;
  border-collapse: collapse; }

th, td {
  padding: 0; }

h1,
h2,
h3,
h4,
h5,
h6,
p {
  font-size: 100%;
  margin: 0;
  padding: 0;
  font-weight: normal; }

img {
  border: none;
  font-size: 1%;
  line-height: 1;
  vertical-align: top; }

dl {
  zoom: 1; }

dl, dt, dd {
  margin: 0;
  padding: 0; }

ul, ul li {
  margin: 0;
  padding: 0;
  list-style: none; }

ol {
  margin: 0 0 10px 0.8em;
  padding: 0 0 0 0.8em; }

ol li {
  margin: 0;
  padding: 0;
  list-style-position: outside; }

form, input, select {
  font: 100%;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.clear {
  clear: both; }

.protect {
  -webkit-touch-callout: none; }

.borderNone {
  border: none !important; }

.block {
  display: block; }

.bold {
  font-weight: bold; }

.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; }

.pd5 {
  padding: 5px; }

.pdtb5 {
  padding-top: 5px;
  padding-bottom: 5px; }

.pd10 {
  padding: 10px; }

.pd15 {
  padding: 15px; }

.red,
.error {
  color: red;
  margin-bottom: 5px; }

.white {
  color: white !important; }

.fontXXS {
  font-size: 77%; }

.fontXS {
  font-size: 85%; }

.fontS {
  font-size: 93%; }

.fontM {
  font-size: 108%; }

.fontL {
  font-size: 116%; }

.fontXL {
  font-size: 123.1%; }

.fontXXL {
  font-size: 131%; }

.gray {
  color: #ccc !important; }

.center {
  text-align: center; }

.right {
  text-align: right; }

.hidden {
  overflow: hidden; }

#page {
  position: relative;
  width: 100%;
  min-width: 960px;
  background: #000; }

/* ====================================
	
ヘッダー

==================================== */
#globalHeader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 44px;
  background: rgba(0, 0, 0, 0.4);
  z-index: 9999; }
  #globalHeader h1 {
    width: 232px;
    height: 44px;
    background: url(../../images/sweetroom.png) no-repeat left center;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap; }
    #globalHeader h1 a {
      display: block; }
  #globalHeader #menu {
    position: absolute;
    top: 11px;
    right: 0; }
    #globalHeader #menu li {
      display: inline-block;
      margin-left: 30px;
      letter-spacing: 1px; }
      #globalHeader #menu li a {
        display: block; }
      #globalHeader #menu li#entry {
        background: #ff1759;
        text-align: center;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px; }
        #globalHeader #menu li#entry a {
          padding: 5px 10px; }
          #globalHeader #menu li#entry a:hover {
            color: #fff; }

#main section {
  width: 100%;
  height: auto;
  min-height: 800px;
  background-attachment: fixed;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -ms-background-size: cover !important;
  -o-background-size: cover !important;
  background-size: cover !important; }

/* ====================================
	
1st コンテンツ

==================================== */
#first {
  background: url(../../images/first.jpg) no-repeat; }

#firstTxt, #loading #loadText {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 862px;
  height: 188px;
  margin: -96px 0 0 -431px; }

/* ====================================
	
2nd コンテンツ

==================================== */
#second {
  background: url(../../images/second.jpg) no-repeat; }

#secondTxt {
  position: absolute;
  top: 50%;
  right: 30px;
  width: 583px;
  height: 633px;
  margin: -291.5px 0 0 0; }

/* ====================================
	
3rd コンテンツ

==================================== */
#third {
  background: url(../../images/third.jpg) no-repeat; }

#thirdTxt {
  position: absolute;
  top: 50%;
  left: 0;
  width: 473px;
  height: 543px;
  margin: -271.5px 0 0 0; }

#cd {
  position: absolute;
  top: 50%;
  right: 0px;
  margin: -245px 0 0 0; }

/* ====================================
	
4th コンテンツ

==================================== */
#fourth {
  background: #fff; }

#fourthTxt {
  color: #000; }
  #fourthTxt h1 {
    padding: 60px 0; }
  #fourthTxt ul {
    width: 844px;
    margin: 0 auto;
    overflow: hidden; }
    #fourthTxt ul li {
      float: left; }
      #fourthTxt ul li.step {
        width: 240px; }
      #fourthTxt ul li.next {
        width: 32px;
        height: 267px;
        padding: 0 15px;
        background: url(../../images/arrow.gif) no-repeat center center;
        text-indent: 100%;
        overflow: hidden;
        white-space: nowrap; }

/* ====================================
	
5th コンテンツ

==================================== */
#fifth {
  background: url(../../images/fifth.jpg) no-repeat; }

#fifthTxt h1 {
  padding: 120px 0 60px; }

/* ====================================
	
コンタクトフォーム

==================================== */
#contact {
  padding-top: 132px;
  color: #fff;
  background: url(../../images/contact.jpg) no-repeat; }

#contactForm {
  width: 480px;
  margin: 0 auto 30px; }
  #contactForm dt {
    margin-bottom: 5px; }
    #contactForm dt .require {
      color: red;
      font-size: 85%;
      letter-spacing: .1em; }
  #contactForm dd {
    margin-bottom: 15px; }
    #contactForm dd .inputStyle {
      width: 480px;
      background: #fff;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      -ms-border-radius: 5px;
      -o-border-radius: 5px;
      border-radius: 5px; }
      #contactForm dd .inputStyle input,
      #contactForm dd .inputStyle textarea {
        display: block;
        width: 100%;
        background: none;
        border: none;
        -webkit-box-sizing: border-box;
        box-sizing: border-box; }
      #contactForm dd .inputStyle input,
      #contactForm dd .inputStyle textarea {
        padding: 10px 15px;
        font-size: 116%; }
      #contactForm dd .inputStyle textarea {
        height: 10em; }

#btnSubmit {
  width: 200px;
  margin: 0 auto;
  background: #ff1759;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px; }
  #btnSubmit input,
  #btnSubmit textarea {
    display: block;
    width: 100%;
    background: none;
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  #btnSubmit input {
    padding: 15px 0;
    color: #fff;
    font-weight: bold;
    font-size: 116%;
    letter-spacing: .3px;
    cursor: pointer; }

#btnModify {
  width: 200px;
  margin: 30px auto 0; }
  #btnModify input,
  #btnModify textarea {
    display: block;
    width: 100%;
    background: none;
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  #btnModify input {
    color: #fff;
    font-size: 108%;
    cursor: pointer; }

.tel {
  width: 300px;
  margin: 0 auto;
  padding: 15px 0;
  border: 1px #fff solid; }

/* ====================================
	
フッター

==================================== */
#globalFooter {
  width: 100%;
  padding: 15px 0;
  text-align: center;
  font-size: 85%; }
  #globalFooter small {
    color: #fff; }

#widget {
  width: 728px;
  margin: 0 auto; }

/* ====================================
	
モジュール

==================================== */
.inner {
  position: relative;
  width: 960px;
  height: 100%;
  margin: 0 auto; }

.txt {
  letter-spacing: 1px;
  line-height: 28px;
  color: #fff; }

.arrow {
  font-size: 77%;
  margin-left: .5em;
  vertical-align: top; }

.col2 {
  padding-top: 40px;
  border-top: 1px #000 solid; }

.leftCol {
  float: left;
  width: 480px; }

.rightCol {
  float: right;
  width: 480px; }

.btnEntry {
  width: 360px;
  margin: 0 auto;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }
  .btnEntry a {
    display: block;
    height: 60px;
    background: url(../../images/btn_entry.png) no-repeat 0 0; }
    .btnEntry a:hover {
      background-position: 0 -60px; }

#btnEntryBottom {
  width: 640px;
  margin: 0 auto;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }
  #btnEntryBottom a {
    display: block;
    height: 90px;
    background: url(../../images/btn_entry_large.png) no-repeat 0 0; }
    #btnEntryBottom a:hover {
      background-position: 0 -90px; }

#loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  z-index: 9999; }
  #loading .section {
    position: relative;
    overflow: hidden; }
  #loading #loadText {
    display: none; }

@media screen and (min-device-width: 960px) {
  #fifth {
    height: 500px !important; } }
@media screen and (max-device-width: 959px) {
  #page {
    min-width: 100% !important; }

  .inner {
    width: 100% !important; }

  #first {
    background: url(../../images/first_sp.jpg) no-repeat !important; }

  #second {
    background: url(../../images/second_sp.jpg) no-repeat !important; }

  #secondTxt {
    position: absolute;
    top: 10%;
    left: 50%;
    width: 583px;
    height: 633px;
    margin: 0 0 0 -316.5px; }

  #third {
    background: url(../../images/third_sp.jpg) no-repeat !important; }

  #fifth {
    background: url(../../images/fifth_sp.jpg) no-repeat !important; } }

/*# sourceMappingURL=styles.css.map */