@charset "UTF-8";
#sim {
  /*/////////////////////////////
  シミュレータ部
  /////////////////////////////*/
  width: 1000px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  /*./sim_area*/
  /*
  =======================
  カート内関係CSS
  =======================
  */
  /*/.cart_item*/
  /*/#cart_form*/ }
  @media screen and (max-width: 767px) {
    #sim {
      padding-top: 10%;
      width: 92%; } }
  #sim .sec_01 {
    width: 400px;
    margin-right: 600px; }
    @media screen and (max-width: 767px) {
      #sim .sec_01 {
        width: 100%;
        margin-right: 0;
        order: 1;
        margin-bottom: 25px; } }
  #sim .sec_02 {
    border-top: solid 1px #e6e6e6;
    width: 400px;
    margin-top: 25px;
    padding-top: 25px;
    padding-bottom: 25px;
    margin-right: 600px;
    margin-bottom: 35px; }
    @media screen and (max-width: 767px) {
      #sim .sec_02 {
        width: 100%;
        margin-right: 0;
        order: 3; } }
  #sim .sec_03 {
    width: 550px;
    position: absolute;
    margin-left: 450px; }
    @media screen and (max-width: 767px) {
      #sim .sec_03 {
        width: 100%;
        margin-left: 0;
        position: static;
        order: 2; } }
  #sim .bg_gray {
    color: #ffffff;
    background-image: url(../../img/cmn/bg_gray.png);
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: right center;
    display: inline-block;
    padding: 0 10px;
    margin-right: 10px;
    margin-bottom: 15px;
    width: 90px;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #sim .bg_gray {
        width: 25%;
        margin-right: 2%;
        font-size: 4vw; } }
  #sim .text_01 {
    font-size: 15px;
    border: 1px solid #666666;
    padding: 5px;
    border-radius: 5px;
    width: 270px;
    color: #666666;
    display: inline-block; }
    @media screen and (max-width: 767px) {
      #sim .text_01 {
        width: 70%; } }
  #sim p.btn_on {
    background-color: #FF9800;
    color: #ffffff;
    padding: 3px;
    text-align: center;
    display: inline-block;
    width: 130px;
    border-radius: 5px;
    margin: 3px; }
    @media screen and (max-width: 767px) {
      #sim p.btn_on {
        width: 33%;
        margin: 1%;
        font-size: 4vw; } }
  #sim p.btn_off {
    padding: 3px;
    text-align: center;
    display: inline-block;
    width: 130px;
    border-radius: 5px;
    border: solid 1px #666666;
    margin: 3px; }
    @media screen and (max-width: 767px) {
      #sim p.btn_off {
        width: 33%;
        margin: 1%;
        font-size: 4vw; } }
  #sim p.btn_on:hover,
  #sim p.btn_off:hover,
  #sim p.color_select:hover {
    cursor: pointer; }
  #sim p.color_select {
    display: inline-block;
    width: 270px;
    border-radius: 5px;
    margin: 3px;
    border: 1px solid #666666;
    padding: 5px;
    vertical-align: super; }
    @media screen and (max-width: 767px) {
      #sim p.color_select {
        width: 70%;
        font-size: 4vw; } }
    #sim p.color_select #colortip {
      border: solid 1px #666666;
      width: 50px;
      display: inline-block;
      height: 25px;
      margin-right: 5px;
      vertical-align: middle;
      border-radius: 5px;
      background-size: 100% auto; }
  #sim .sim_area {
    /*半袖Tシャツ*/
    /*ロングTシャツ*/ }
    #sim .sim_area #color {
      width: 100%;
      height: 600px;
      margin-bottom: 25px;
      background-size: 150px; }
      @media screen and (max-width: 767px) {
        #sim .sim_area #color {
          height: 60vh; } }
    #sim .sim_area .omote {
      width: 100%;
      height: 600px;
      background-image: url(../../img/cmn/t-base_omote4.png);
      background-size: 100% auto;
      background-repeat: no-repeat; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .omote {
          min-height: 60vh; } }
    #sim .sim_area .ura {
      width: 100%;
      height: 600px;
      background-image: url(../../img/cmn/t-base_ura3.png);
      background-size: 100% auto;
      background-repeat: no-repeat; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .ura {
          min-height: 60vh; } }
    #sim .sim_area .omote_long {
      width: 100%;
      height: 600px;
      background-image: url(../../img/cmn/t-base_omote_long.png);
      background-size: 100% auto;
      background-repeat: no-repeat; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .omote_long {
          min-height: 60vh; } }
    #sim .sim_area .ura_long {
      width: 100%;
      height: 600px;
      background-image: url(../../img/cmn/t-base_ura_long.png);
      background-size: 100% auto;
      background-repeat: no-repeat; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .ura_long {
          min-height: 60vh; } }
    #sim .sim_area .control {
      position: absolute;
      top: 280px;
      left: 25px;
      width: 50px; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .control {
          top: 62%;
          left: 2%; } }
      #sim .sim_area .control .btn_on,
      #sim .sim_area .control .btn_off {
        width: 50px;
        padding: 10px 0;
        margin: 0;
        margin-bottom: 10px; }
      #sim .sim_area .control .btn_off {
        background-color: #ffffff; }
      #sim .sim_area .control .btn_reset {
        width: 50px;
        height: 50px;
        background-color: #808080;
        border-radius: 5px;
        background-image: url(../../img/cmn/icon_reset.png);
        background-size: 70% auto;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 25px; }
        @media screen and (max-width: 767px) {
          #sim .sim_area .control .btn_reset {
            margin-top: 5px; } }
      #sim .sim_area .control .txt_reset {
        font-size: 12px;
        margin-top: 3px; }
      #sim .sim_area .control .txt_reset:hover {
        cursor: pointer; }
    #sim .sim_area .price {
      position: relative; }
    #sim .sim_area .txt_price {
      font-size: 25px; }
      #sim .sim_area .txt_price span {
        font-size: 15px; }
    #sim .sim_area .txt_size {
      position: absolute;
      top: 0;
      right: 100px;
      width: 150px;
      display: block; }
      @media screen and (max-width: 767px) {
        #sim .sim_area .txt_size {
          right: 4%;
          width: 33%; } }
      #sim .sim_area .txt_size img {
        width: 100%; }
  #sim .btn_photoul {
    background-color: #FF9800;
    font-size: 23px;
    color: #ffffff;
    width: 85%;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    display: inline-block;
    vertical-align: top; }
    @media screen and (max-width: 767px) {
      #sim .btn_photoul {
        width: 80%; } }
  #sim .btn_photoul:hover {
    cursor: pointer; }
  #sim .btn_camera {
    background-image: url(../../img/cmn/icon_camera.png);
    width: 45px;
    height: 45px;
    display: inline-block;
    background-color: #62ACFF;
    background-repeat: no-repeat;
    background-size: 70% auto;
    background-position: center;
    border-radius: 5px;
    margin-left: 10px; }
    @media screen and (max-width: 767px) {
      #sim .btn_camera {
        width: 15%; } }
  #sim .btn_camera:hover {
    cursor: pointer; }
  #sim .img_area {
    text-align: center;
    margin-bottom: 25px; }
    #sim .img_area img {
      width: 75%;
      height: auto; }
  #sim .txt_sizeselect {
    background-color: #6E6765;
    color: #ffffff;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    margin-top: 25px;
    margin-bottom: 10px; }
  #sim .txt_sizetype {
    font-size: 13px; }
  #sim .list_sizeselect {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px; }
    #sim .list_sizeselect li {
      width: 15.5%;
      margin: 0.5%;
      text-align: center;
      font-size: 13px; }
      #sim .list_sizeselect li input {
        font-size: 18px;
        border: none;
        padding: 0;
        width: 100%;
        text-align: center; }
    #sim .list_sizeselect .txt_type {
      font-size: 20px; }
    #sim .list_sizeselect li.off {
      border: solid 1px #666666;
      border-radius: 5px;
      padding: 1%; }
    #sim .list_sizeselect li.on {
      background-color: #5ACA64;
      padding: 1%;
      border-radius: 5px;
      color: #ffffff; }
      #sim .list_sizeselect li.on input {
        color: #ffffff;
        background-color: #5ACA64; }
  #sim .hosoku {
    margin-top: 50px;
    padding-bottom: 50px; }
    @media screen and (max-width: 767px) {
      #sim .hosoku {
        order: 4;
        width: 100%; } }
    #sim .hosoku .bnr_box {
      text-align: center;
      margin-bottom: 25px; }
      #sim .hosoku .bnr_box img {
        width: 80%; }
      @media screen and (max-width: 767px) {
        #sim .hosoku .bnr_box img {
          width: 100%; } }
  #sim .cart_flow {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 25px; }
    #sim .cart_flow li {
      font-size: 13px;
      width: 23.5%;
      display: flex;
      background-color: #f2f2f2;
      border: solid 2px #666666;
      border-radius: 5px;
      text-align: center;
      padding: 0.5%;
      align-items: center;
      justify-content: center; }
      @media screen and (max-width: 767px) {
        #sim .cart_flow li {
          vertical-align: 1;
          font-size: 12px; } }
    #sim .cart_flow li.current {
      background-color: #5ACA64;
      color: #ffffff;
      border: none;
      font-weight: bolder; }
    #sim .cart_flow img {
      width: 1%;
      margin: 0 0.5%; }
  #sim .page_title {
    background-color: #6E6765;
    color: #ffffff;
    display: block;
    width: 100%;
    text-align: center;
    padding: 1%;
    font-size: 20px;
    font-weight: bolder;
    margin-bottom: 25px; }
  #sim .cart_item {
    width: 400px;
    margin: auto;
    margin-top: 0;
    padding-bottom: 50px;
    margin-bottom: 50px;
    border-bottom: 1px solid #666666; }
    #sim .cart_item #color {
      min-height: 450px;
      background-size: 150px; }
      @media screen and (max-width: 767px) {
        #sim .cart_item #color {
          min-height: 60vh; } }
      #sim .cart_item #color .omote {
        min-height: 450px;
        background-image: url(../../img/cmn/t-base_omote4.png);
        background-size: 100% auto;
        background-repeat: no-repeat; }
        @media screen and (max-width: 767px) {
          #sim .cart_item #color .omote {
            min-height: 60vh; } }
      #sim .cart_item #color .ura {
        min-height: 450px;
        background-image: url(../../img/cmn/t-base_ura4.png);
        background-size: 100% auto;
        background-repeat: no-repeat; }
        @media screen and (max-width: 767px) {
          #sim .cart_item #color .ura {
            min-height: 60vh; } }
    #sim .cart_item .item_name {
      font-size: 20px; }
    #sim .cart_item table {
      margin-top: 20px;
      width: 100%;
      margin-bottom: 20px; }
      #sim .cart_item table td {
        width: 33%; }
      #sim .cart_item table .price {
        text-align: right; }
  #sim .total {
    display: block;
    width: 600px;
    margin: auto;
    background-color: #FFFBF3;
    padding: 2%;
    margin-bottom: 50px; }
    #sim .total table {
      width: 100%; }
      #sim .total table tr {
        border-bottom: dotted 1px #666666; }
        #sim .total table tr td {
          padding: 2% 0;
          font-size: 20px; }
          @media screen and (max-width: 767px) {
            #sim .total table tr td {
              font-size: 18px; } }
        #sim .total table tr .price {
          text-align: right; }
        #sim .total table tr .total_price {
          text-align: right;
          border-bottom: none; }
          #sim .total table tr .total_price span {
            font-size: 25px; }
  #sim .btns {
    display: block;
    width: 600px;
    margin: auto;
    margin-bottom: 50px; }
    #sim .btns p {
      margin-bottom: 25px; }
      @media screen and (max-width: 767px) {
        #sim .btns p {
          margin-bottom: 15px; } }
  #sim #cart_form {
    width: 600px;
    margin: auto;
    margin-bottom: 50px; }
    #sim #cart_form .form_01, #sim #cart_form .form_02, #sim #cart_form .form_03 {
      border: solid 1px #666666;
      margin-bottom: 25px;
      padding-bottom: 25px; }
    #sim #cart_form h3 {
      background-color: #E6E6E6;
      font-size: 20px;
      padding: 1%;
      font-weight: bolder; }
    #sim #cart_form h4 {
      padding: 2%;
      padding-bottom: 0;
      font-size: 18px;
      font-weight: bolder; }
    #sim #cart_form hr {
      margin: 20px 2%;
      height: 0; }
    #sim #cart_form .inputs {
      padding: 1% 2%; }
      #sim #cart_form .inputs p {
        display: inline-block;
        margin-right: 10px;
        width: 20%; }
        @media screen and (max-width: 767px) {
          #sim #cart_form .inputs p {
            font-size: 13px; } }
      #sim #cart_form .inputs p.title_pay {
        width: 100%;
        font-weight: bolder; }
      #sim #cart_form .inputs input, #sim #cart_form .inputs select {
        width: 70%;
        font-size: 15px;
        padding: 3px;
        vertical-align: top; }
        @media screen and (max-width: 767px) {
          #sim #cart_form .inputs input, #sim #cart_form .inputs select {
            width: 60%;
            font-size: 13px; } }
      #sim #cart_form .inputs span.any {
        background-color: #e6e6e6;
        font-size: 13px;
        padding: 3px;
        margin-right: 10px;
        vertical-align: top; }
      #sim #cart_form .inputs span.must {
        background-color: #E60012;
        color: #ffffff;
        font-size: 13px;
        padding: 3px;
        margin-right: 10px;
        vertical-align: top; }
      #sim #cart_form .inputs .btn_address {
        font-size: 11px; }
      #sim #cart_form .inputs p.notes {
        width: 100%;
        font-size: 13px; }
      #sim #cart_form .inputs input[type="radio"] {
        width: 5%; }
      #sim #cart_form .inputs label.radio {
        display: inline-block;
        width: 100%;
        margin-top: 20px;
        padding-top: 20px; }
        @media screen and (max-width: 767px) {
          #sim #cart_form .inputs label.radio {
            font-size: 13px; } }
      #sim #cart_form .inputs select.yearmonth {
        width: 20%; }
    #sim #cart_form textarea.bikou {
      margin: 2%;
      width: 95%;
      font-size: 15px;
      padding: 1%; }
    #sim #cart_form div.inner {
      padding: 2%; }
    #sim #cart_form p span.ordernum {
      font-size: 25px;
      color: #E60012; }

/*#sim*/
.color_selector ul {
  display: flex;
  flex-wrap: wrap; }
  .color_selector ul li {
    width: 14.5%;
    margin: 1%; }
    @media screen and (max-width: 767px) {
      .color_selector ul li {
        width: 48%; } }
    .color_selector ul li a {
      text-align: center;
      border: solid 1px #666666;
      border-radius: 5px;
      padding: 5px;
      width: 100%;
      display: block;
      font-size: 12px;
      line-height: 1.25; }
      .color_selector ul li a div {
        width: 100%;
        height: 30px;
        background-size: 100% auto; }
    .color_selector ul li a:hover {
      text-decoration: none; }

/*カラー設定*/
.c001 {
  background-image: url(../../img/color/001_white.jpg); }

.c002 {
  background-image: url(../../img/color/002_black.jpg); }

.c005 {
  background-image: url(../../img/color/005_ash.jpg); }

.c006 {
  background-image: url(../../img/color/006_mixgray.jpg); }

.c007 {
  background-image: url(../../img/color/007_chacoal.jpg); }

.c019 {
  background-image: url(../../img/color/019_natural.jpg); }

.c022 {
  background-image: url(../../img/color/022_gold.jpg); }

.c025 {
  background-image: url(../../img/color/025_brightgreen.jpg); }

.c035 {
  background-image: url(../../img/color/035_citygreen.jpg); }

.c036 {
  background-image: url(../../img/color/036_limegreen.jpg); }

.c052 {
  background-image: url(../../img/color/052_darkbrown.jpg); }

.c053 {
  background-image: url(../../img/color/053_lighebeige.jpg); }

.c064 {
  background-image: url(../../img/color/064_orange.jpg); }

.c066 {
  background-image: url(../../img/color/066_pink.jpg); }

.c069 {
  background-image: url(../../img/color/069_red.jpg); }

.c072 {
  background-image: url(../../img/color/072_bargandy.jpg); }

.c076 {
  background-image: url(../../img/color/076_labender.jpg); }

.c079 {
  background-image: url(../../img/color/079_mattpurple.jpg); }

.c085 {
  background-image: url(../../img/color/085_royalblue.jpg); }

.c086 {
  background-image: url(../../img/color/086_navy.jpg); }

.c088 {
  background-image: url(../../img/color/088_slate.jpg); }

.c232 {
  background-image: url(../../img/color/232_highred.jpg); }

.c369 {
  background-image: url(../../img/color/369_banana.jpg); }

.c487 {
  background-image: url(../../img/color/487_lightyellow.jpg); }

.c488 {
  background-image: url(../../img/color/488_lightblue.jpg); }

.c495 {
  background-image: url(../../img/color/495_lightpink.jpg); }

.c497 {
  background-image: url(../../img/color/497_ivygreen.jpg); }

.c511 {
  background-image: url(../../img/color/511_tropicalpink.jpg); }

.c537 {
  background-image: url(../../img/color/537_sandkaki.jpg); }

.c538 {
  background-image: url(../../img/color/538_tarcoizeblue.jpg); }

.c539 {
  background-image: url(../../img/color/539_violetpurple.jpg); }

.c575 {
  background-image: url(../../img/color/575_applegreen.jpg); }

.c576 {
  background-image: url(../../img/color/576_babypink.jpg); }

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