@charset "UTF-8";
/*---------------------------
edit
----------------------------*/
/*---------------------------
Response
----------------------------*/
.pc {
  display: block !important;
}
@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

.sp {
  display: none !important;
}
@media screen and (max-width: 767px) {
  .sp {
    display: block !important;
  }
}

/*---------------------------
common
----------------------------*/
@media screen and (max-width: 767px) {
  img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 767px) {
  html {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media screen and (max-width: 767px) {
  body {
    width: 100% !important;
  }
}

.sp_width {
  width: 1100px;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .sp_width {
    width: 100% !important;
    padding: 0 5% !important;
    box-sizing: border-box !important;
  }
  .sp_width a {
    display: block;
    padding: 0.5rem 0;
  }
  .sp_width a b font {
    font-size: 0.9rem !important;
  }
  .sp_width > br {
    display: none;
  }
}

.sp_menu {
  width: 55px;
  height: 55px;
  background-image: url(../img/sp_menu.png);
  background-size: 60% 70%;
  background-repeat: no-repeat;
  background-color: #fff;
  background-position: center center;
  position: fixed;
  top: 1rem;
  right: 1rem;
  display: none;
  z-index: 1000;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
  border-radius: 5px;
}
@media screen and (max-width: 767px) {
  .sp_menu {
    display: block;
  }
}

#musk {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  display: none;
  z-index: 998;
}
@media screen and (max-width: 767px) {
  #musk {
    display: none;
  }
}

#floting {
  display: none;
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100%;
  background-color: #fff;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
}
@media screen and (max-width: 767px) {
  #floting {
    display: block;
  }
}
#floting a {
  padding: 5px 0 5px 0 !important;
}
#floting a img {
  max-width: 90%;
  height: auto;
}

#header h1 {
  background-image: none !important;
  margin-top: 30px;
}
#header h1 a {
  background-image: none !important;
  text-indent: 0 !important;
  margin-top: 0 !important;
  display: block !important;
  width: 100% !important;
}
#header h1 a img {
  width: 408px;
  height: auto;
}
#header h2 {
  height: 48px;
  background-size: 100% 100%;
}
@media screen and (max-width: 767px) {
  #header {
    width: 100%;
    height: auto;
    padding-top: 0;
  }
  #header h1,
  #header h2 {
    width: 100%;
    background-repeat: no-repeat;
  }
  #header h1 {
    width: 83%;
    height: auto;
    background-size: 78% auto;
    margin-top: 1.5rem;
    margin-bottom: 0;
    text-align: left;
  }
  #header h1 img {
    width: 100%;
    height: auto;
  }
  #header h2 {
    height: 13vw;
    background-size: 100% auto;
    background-position: top center;
    background-image: url(../img/top_header_sp.jpg);
  }
  #header .fr {
    float: none;
  }
  #header .fr a {
    width: 100%;
    height: 11vw;
    background-size: 90% auto;
    background-position: center center;
    background-repeat: no-repeat;
    margin-top: 0.5rem;
  }
}

@media screen and (max-width: 767px) {
  #footer {
    margin-top: 0.5rem !important;
  }
}

@media screen and (max-width: 767px) {
  #main {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
    overflow: hidden;
  }
}
@media screen and (max-width: 767px) {
  #main #left {
    position: fixed;
    top: 0;
    left: -270px;
    background: #fff;
    padding: 1rem;
    width: 270px;
    height: 100%;
    box-sizing: border-box;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.6);
    transition: 0.5s;
    -webkit-transition: 0.5s;
    z-index: 999;
    overflow-y: scroll;
  }
  #main #left.slide {
    left: 0px;
  }
  #main #left ul li a {
    background-size: auto 100% !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    box-sizing: border-box !important;
  }
  #main #left ul li a:hover {
    height: 38px !important;
    background-color: #fff1e0 !important;
  }
  #main #left ul li.top a {
    height: 50px !important;
  }
  #main #left ul li.flow a {
    height: 50px !important;
  }
  #main #left ul li.price a {
    height: 50px !important;
  }
  #main #left ul li.qa a {
    height: 50px !important;
  }
  #main #left ul li.policy a {
    height: 50px !important;
  }
  #main #left .ph {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
  }
  #main #left .ph a {
    display: block;
    width: 49%;
  }
  #main #left h2.btn a {
    height: 20px;
  }
  #main #left h4 img {
    width: 15%;
    height: auto;
    vertical-align: middle;
    margin-right: 10px;
  }
  #main #left h4 span {
    display: block;
    padding-top: 0.3rem;
  }
  #main #left h4 br {
    display: none;
  }
}
#main #right {
  /*---------------------------
  PC
  ----------------------------*/
  /*---------------------------
  スマホ
  ----------------------------*/
}
#main #right h4.kodawari01,
#main #right h4.kodawari02,
#main #right h4.kodawari03 {
  height: auto !important;
  background: none;
  text-indent: 0;
  margin-top: 3rem;
  margin-bottom: 2rem;
  text-align: left;
}
#main #right .kodawari02,
#main #right .kodawari03 {
  border-top: 1px solid #ccc !important;
  padding-top: 3rem;
}
#main #right .kodawari_img {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 1rem;
}
#main #right .koukin_box .sp {
  display: none;
}
@media screen and (max-width: 767px) {
  #main #right {
    width: 100%;
    /*---------------------------
    下層ページ
    ----------------------------*/
  }
  #main #right p {
    font-size: 100%;
  }
  #main #right .mt_30 {
    display: none;
  }
  #main #right h2.main_img {
    width: 100%;
    height: 56vw;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-image: url(../img/main_img_sp.jpg);
    margin-top: 1rem;
    margin-bottom: 2rem;
  }
  #main #right h3.omakase {
    width: 100%;
    height: 29vw;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-image: url(../img/r_title_sp.jpg);
  }
  #main #right h4.kodawari01,
  #main #right h4.kodawari02,
  #main #right h4.kodawari03 {
    width: 100%;
    height: 30vw;
    background-image: none !important;
    background-size: 100% auto;
  }
  #main #right h4.kodawari03 {
    background-repeat: no-repeat;
    height: auto;
  }
  #main #right .kodawari_img {
    flex-wrap: wrap;
    background-size: 100% auto !important;
  }
  #main #right .kodawari_img img:nth-of-type(1) {
    display: block;
    width: 60%;
    margin: auto;
    margin-bottom: 0.5rem;
  }
  #main #right .kodawari_img a {
    display: block;
  }
  #main #right .kodawari_img a:nth-of-type(1) {
    width: 55%;
  }
  #main #right .kodawari_img a:nth-of-type(1) img {
    width: 100%;
  }
  #main #right .kodawari_img a:nth-of-type(2) {
    width: 43%;
  }
  #main #right .kodawari_img a:nth-of-type(2) img {
    width: 100%;
  }
  #main #right .ba_ph .ph_box {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
  }
  #main #right .ba_ph .ph_box a {
    display: block;
    width: 50%;
  }
  #main #right h3.koukin {
    width: 100% !important;
    height: 20vw !important;
    background-size: 100% 100%;
    background-image: url(../img/otodoke_title_sp.jpg);
  }
  #main #right .koukin_box {
    margin: 0;
    background-image: none;
  }
  #main #right .koukin_box .fl {
    float: none;
  }
  #main #right .koukin_box .inner {
    display: none;
  }
  #main #right .koukin_box .sp {
    display: block;
  }
  #main #right h3.kouka {
    width: 100% !important;
    height: 20vw !important;
    background-size: 100% auto;
    padding: 0;
  }
  #main #right .kouka_box .inner {
    width: 100%;
    padding: 2rem;
    box-sizing: border-box;
  }
  #main #right .kouka_box .inner .inner_left,
  #main #right .kouka_box .inner .inner_left02,
  #main #right .kouka_box .inner .inner_left03 {
    width: 100%;
  }
  #main #right .kouka_box .inner .ph_01,
  #main #right .kouka_box .inner .ph_02,
  #main #right .kouka_box .inner .ph_03 {
    width: 100%;
    height: auto;
    margin: 0;
  }
  #main #right h3.voice {
    width: 100%;
    height: 28vw;
    background-position: top center;
    background-size: 100% auto;
    background-image: url(../img/r_title03_sp.jpg);
  }
  #main #right .voice_bottom02,
  #main #right .voice_bottom {
    width: 100%;
    border: 1px solid #000;
    border-radius: 15px;
    background-image: none;
    padding: 1.5rem;
    box-sizing: border-box;
  }
  #main #right .voice_bottom02 .bg,
  #main #right .voice_bottom02 .bg02,
  #main #right .voice_bottom .bg,
  #main #right .voice_bottom .bg02 {
    width: 100% !important;
    height: auto !important;
    background-image: none !important;
    padding: 0 !important;
    margin-bottom: 0.3rem !important;
  }
  #main #right .voice_bottom02 .l_tx,
  #main #right .voice_bottom02 .l_tx02,
  #main #right .voice_bottom .l_tx,
  #main #right .voice_bottom .l_tx02 {
    width: 100% !important;
    line-height: 1.4rem !important;
  }
  #main #right .voice_bottom02 p,
  #main #right .voice_bottom p {
    margin: 0 !important;
    padding: 0 !important;
  }
  #main #right #order {
    width: 100%;
  }
  #main #right #order .order {
    width: 100%;
    height: 23vw;
    background-position: top center;
    background-size: 100% auto;
    background-image: url(../img/r_title04_sp.jpg);
  }
  #main #right .order_box {
    width: 100%;
    box-sizing: border-box;
  }
  #main #right .order_box .ph {
    width: 100% !important;
    margin: 0 !important;
  }
  #main #right .order_box .order_title01,
  #main #right .order_box .order_title02,
  #main #right .order_box .order_title03,
  #main #right .order_box .order_title04,
  #main #right .order_box .order_title05 {
    width: 100% !important;
    height: 14vw !important;
    background-size: 100% 100% !important;
    margin-bottom: 1rem !important;
  }
  #main #right .order_box .order_btn {
    width: 100% !important;
    float: none !important;
  }
  #main #right .order_box .order_btn a {
    width: 100% !important;
    height: auto !important;
  }
  #main #right .order_box .oeder_btn {
    clear: both !important;
    float: none !important;
    padding-top: 1rem !important;
  }
  #main #right .order_box .oeder_btn a {
    display: block !important;
    width: 70% !important;
    height: 6vw !important;
    background-size: 100% 100% !important;
    margin: auto !important;
  }
  #main #right .order_box .soryo {
    width: 20% !important;
    float: left !important;
    margin: 0 !important;
    margin-left: 3% !important;
  }
  #main #right .order_box .order_price01,
  #main #right .order_box .order_price02,
  #main #right .order_box .order_price03,
  #main #right .order_box .order_price04,
  #main #right .order_box .order_price05 {
    width: 70% !important;
    float: right !important;
    margin: 0 !important;
    background-size: 100% auto !important;
    margin-right: 3% !important;
  }
  #main #right .other {
    width: 100% !important;
    background-size: 125% 15vw !important;
    height: 12vw !important;
    background-image: url(../img/r_title05_sp.jpg) !important;
    background-size: 100% auto !important;
    margin-top: 1rem !important;
  }
  #main #right .other_btn {
    width: 100% !important;
    float: none !important;
    padding-top: 1rem !important;
    text-align: center !important;
  }
  #main #right .other_btn a {
    height: 10vw !important;
    display: block !important;
    margin: auto !important;
    background-image: url(../img/r_title05_btn01_sp.jpg) !important;
    background-size: 100% auto !important;
    margin-top: 1rem !important;
  }
  #main #right .saigoni {
    width: 100% !important;
    margin: 0 !important;
    margin-bottom: 1rem !important;
  }
  #main #right .last_oeder_btn {
    width: 100% !important;
  }
  #main #right .last_oeder_btn a {
    width: 100% !important;
    height: 12vw !important;
    margin: 0 !important;
    background-size: 100% auto !important;
  }
  #main #right #flow h2,
  #main #right #qa h2,
  #main #right #policy h2,
  #main #right .policy h2 {
    width: 100% !important;
    height: 11vw !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background-size: 100% 100% !important;
    margin-bottom: 10px !important;
  }
  #main #right #flow p,
  #main #right #qa p,
  #main #right #policy p,
  #main #right .policy p {
    width: 100% !important;
  }
  #main #right #flow h2 {
    background-image: url(../img/flow/title_01_sp.jpg) !important;
  }
  #main #right #qa h2 {
    background-image: url(../img/qa/title_01_sp.jpg) !important;
  }
  #main #right #policy h2.main_title01 {
    background-image: url(../img/policy/title_01_sp.jpg) !important;
  }
  #main #right .flow .flow_box {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 1.5rem !important;
  }
  #main #right .flow .flow_box .fl,
  #main #right .flow .flow_box .fr {
    float: none !important;
  }
  #main #right .flow .flow_box h3 {
    width: 100% !important;
    height: 14vw !important;
    margin: 0 !important;
    margin-bottom: 1rem !important;
    background-size: 100% auto !important;
  }
  #main #right .flow .flow_box h3.flow_01 {
    background-image: url(../img/flow/flow_01_sp.jpg) !important;
    height: 11vw !important;
  }
  #main #right .flow .flow_box h3.flow_02 {
    background-image: url(../img/flow/flow_02_sp.jpg) !important;
    height: 18vw !important;
  }
  #main #right .flow .flow_box h3.flow_03 {
    background-image: url(../img/flow/flow_03_sp.jpg) !important;
    height: 12vw !important;
  }
  #main #right .flow .flow_box h3.flow_04 {
    background-image: url(../img/flow/flow_04_sp.jpg) !important;
    height: 12vw !important;
  }
  #main #right .flow .flow_box h3.flow_05 {
    background-image: url(../img/flow/flow_05_sp.jpg) !important;
    height: 6vw !important;
  }
  #main #right .flow .flow_box h3.flow_06 {
    background-image: url(../img/flow/flow_06_sp.jpg) !important;
    height: 12vw !important;
  }
  #main #right .flow .flow_box h3.flow_07 {
    background-image: url(../img/flow/flow_07_sp.jpg) !important;
    height: 12vw !important;
  }
  #main #right .flow .flow_box p {
    width: 100% !important;
    margin: 0 !important;
  }
  #main #right .flow .flow_box p.flow_y {
    box-sizing: border-box !important;
  }
  #main #right .qa .qa_box {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 1.5rem !important;
  }
  #main #right .qa .qa_box .fl,
  #main #right .qa .qa_box .fr {
    float: none !important;
  }
  #main #right .qa .qa_box h3 {
    width: 100% !important;
    height: 14vw !important;
    margin: 0 !important;
    margin-bottom: 1rem !important;
    background-size: 100% auto !important;
  }
  #main #right .qa .qa_box h3.qa_01 {
    background-image: url(../img/qa/q_01_sp.jpg) !important;
    height: 14vw !important;
  }
  #main #right .qa .qa_box h3.qa_02 {
    background-image: url(../img/qa/q_02_sp.jpg) !important;
    height: 14vw !important;
  }
  #main #right .qa .qa_box h3.qa_03 {
    background-image: url(../img/qa/q_03_sp.jpg) !important;
    height: 14vw !important;
  }
  #main #right .qa .qa_box h3.qa_04 {
    background-image: url(../img/qa/q_04_sp.jpg) !important;
    height: 14vw !important;
  }
  #main #right .qa .qa_box h3.qa_05 {
    background-image: url(../img/qa/q_05_sp.jpg) !important;
    height: 14vw !important;
  }
  #main #right .qa .qa_box h3.qa_06 {
    background-image: url(../img/qa/q_06_sp.jpg) !important;
    height: 16vw !important;
  }
  #main #right .qa .qa_box p {
    width: 100% !important;
    margin: 0 !important;
  }
  #main #right .qa .qa_box p.flow_y {
    box-sizing: border-box !important;
  }
  #main #right .qa .qa_box .qa_a {
    box-sizing: border-box !important;
  }
  #main #right .policy h2.main_title02 {
    background-image: url(../img/policy/title_02_sp.jpg) !important;
  }
  #main #right .policy h2.main_title03 {
    background-image: url(../img/policy/title_03_sp.jpg) !important;
  }
  #main #right .policy table {
    display: block !important;
    width: 100% !important;
  }
  #main #right .policy table tr {
    display: block !important;
  }
  #main #right .policy table tr th,
  #main #right .policy table tr td {
    width: 100% !important;
    display: block !important;
    border: none !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }
  #main #right .policy table tr th {
    background-color: #eee !important;
  }
  #main #right .policy .t_poli02 {
    width: 100% !important;
  }
  #main #right .policy .t_poli02 th {
    box-sizing: border-box !important;
  }
  #main #right .last_oeder_btn {
    padding-bottom: 7rem;
  }
}

@media screen and (max-width: 767px) {
  #page-top {
    bottom: 5.5rem !important;
    right: 1rem !important;
  }
  #page-top a {
    width: 50px !important;
    height: 76px !important;
    padding: 0 !important;
    background-size: 100% 100% !important;
  }
}

@media screen and (max-width: 767px) {
  #footer {
    width: 100% !important;
    box-sizing: border-box !important;
    font-size: 60% !important;
  }
}

.movie {
  padding: 5rem 0 3rem 0;
}
@media screen and (max-width: 767px) {
  .movie {
    padding: 3rem 0 1.5rem 0;
  }
}
.movie p {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 1rem !important;
}
.movie p .pc {
  display: block;
}
@media screen and (max-width: 767px) {
  .movie p .pc {
    display: none;
  }
}
.movie p .sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .movie p .sp {
    display: block;
    max-width: 85%;
  }
}
.movie .movie-box {
  border-radius: 10px;
  overflow: hidden;
}
.movie .movie-box iframe {
  width: 100% !important;
  vertical-align: bottom;
}
@media screen and (max-width: 767px) {
  .movie .movie-box iframe {
    height: 48vw !important;
  }
}