@charset "utf-8";
/* CSS Document */
#cwbrand img {
  width: 100%;
  height: auto;
}
#cwbrand a:hover img {
  opacity: 0.7;
}
.img_sizeS {
  width: 30%;
}
#cwbrand .reheatL {
  font-size: clamp(1.74rem, 0.376rem + 2.97vw, 2.6rem);
  font-weight: bold;
  margin: 1% 0 0 1.5%;
}
#cwbrand .reheatL > span {
  vertical-align: super; /*テキストを上付きに*/
  font-size: 0.6em; /*テキストを小さく*/
}
@media screen and (min-width:737px) {
  #cwbrand.pc-none {
    display: none;
  }
  #cwbrand {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    padding: 0;
    color: #000;
    font-family: "Noto Sans JP";
    width: calc(100vw - 0.7%);
  }
  #cwbrand .color_bg {
    background-color: #cde4ec;
    padding: 0;
  }
  #cwbrand h1, #cwbrand h2, #cwbrand h3, #cwbrand p {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
  }
  #cwbrand ul, #cwbrand li, #cwbrand dl, #cwbrand dt, #cwbrand dd {
    /*margin: 0;*/
    list-style: none;
    padding: 0;
  }
  #cwbrand img {
    display: block;
  }
  #cwbrand .conL {
    float: left;
    overflow: hidden;
    width: 19%;
    margin: 0 2%;
  }
  #cwbrand .conL02 {
    float: left;
    overflow: hidden;
    width: 19%;
    margin: 2%;
  }
  #cwbrand .conLP {
    float: left;
    oveflow: hidden;
    width: 50%;
    margin: 0;
  }
  #cwbrand .conR {
    float: right;
    overflow: hidden;
    width: auto;
    margin: 0;
  }
  #cwbrand .kv_area {
    max-width: 1200px;
    margin: 0 auto;
  }
  #cwbrand .h2_tit {
    max-width: 1100px;
    font-size: 2.2em;
    font-weight: 700;
    border-bottom: solid 2px #ebebeb;
    margin: 2% auto;
    padding: 1%;
  }
  #cwbrand .board_tit {
    font-size: 2.2em;
    text-align: center;
    color: #9C6B4C;
    margin: 0;
    padding: 2rem 0;
  }
  #cwbrand .look_tit {
    font-size: 2.2em;
    text-align: center;
    color: #9C6B4C;
    margin: 0;
    padding: 2rem 0;
  }
  #cwbrand .line {
    max-width: 1100px;
    border-top: solid 2px #ebebeb;
    margin: 0 auto;
  }
  #cwbrand section {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 .2rem;
  }
  #cwbrand .cw_logo {
    width: 27%;
    margin: 2% 1.5%;
    padding: 0;
    color: #757575;
  }
  #cwbrand .catch {
    width: 56%;
    margin: 3% 1.5%;
    padding: 0;
  }
  #cwbrand .leadLL {
    font-size: 3.9em;
    font-weight: bold;
    letter-spacing: 0.08em;
    margin: 0;
    padding: 0;
  }
  #cwbrand .leadL {
    font-size: 1.26em;
    font-weight: bold;
    letter-spacing: 0.09em;
    line-height: 2.1em;
    margin: 2% 1.5%;
    padding: 0;
  }
  #cwbrand .leadLC {
    font-size: 1.26em;
    font-weight: bold;
    letter-spacing: 0.09em;
    line-height: 2.1em;
    margin: 2% 1.5%;
    margin-left: 18%;
    padding: 0;
    text-align: left;
  }
  #cwbrand .leadS {
    font-size: 0.9em;
    margin: 0 0 1.5% 1.5%;
    padding: 0;
  }
  #cwbrand .leadM {
    font-size: 1.7em;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0 1.5% 0 1.5%;
    padding: 0;
  }
  #cwbrand .leadMM {
    font-size: 1.0em;
    font-weight: bold;
    margin: 0 1.5%;
    padding: 0;
  }
  #cwbrand .leadM > span {
    font-size: 70%;
  }
  #cwbrand .lead {
    font-size: 0.95em;
    font-weight: bold;
    letter-spacing: 0.09em;
    line-height: 1.8em;
    margin: 2.5% 1.5%;
    padding: 0;
  }
  #cwbrand .lead > span {
    font-size: 70%;
  }
  #cwbrand .leadR {
    font-size: 0.7em;
    text-align: right;
  }
  #cwbrand .italic {
    font-style: italic;
  }
  #cwbrand .italicL {
    font-size: 2.4em;
    font-weight: bold;
    letter-spacing: 0.09em;
    margin: 1% 0 0 1.5%;
    padding: 0;
    font-style: italic;
  }
  #cwbrand .italicL > span {
    font-style: normal;
  }
  /*board*/
  #cwbrand .board-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
    justify-content: center;
  }
  #cwbrand .board-wrap div {
    width: calc(100%/4 - 60px);
    margin-right: 40px;
    padding: 0; /*←画像の左右余白*/
    box-sizing: border-box;
  }
  #cwbrand .board-wrap div:nth-of-type(4n) {
    margin-right: 0;
  }
  #cwbrand .board-tit {
    color: #9C6B4C;
    font-size: 1.2rem;
    border: solid #9C6B4C;
    border-width: 4px 0 0;
    padding: .8rem 0;
  }
  #cwbrand .board-nam {
    color: #9C6B4C;
    font-size: 3.5rem;
    font-weight: bold;
    text-align: center;
    font-family: Arial, Helvetica, "sans-serif"
  }
  #cwbrand .board-txt {
    color: #9C6B4C;
    font-size: 1.0rem;
    text-align: left;
    font-weight: 500;
  }
  /*LOOK*/
  #cwbrand .look-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
  }
  #cwbrand .look-wrap div {
    width: calc(100%/6); /*←画像を横に並べる数*/
    padding: 0; /*←画像の左右余白*/
    box-sizing: border-box;
  }
  #cwbrand .look-wrap div img {
    max-width: 100%; /*画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
    /*border: solid 1px #fff; ←画像を1pxのグレーの枠線で囲む指定の場合*/
  }
  /*bnr*/
  #cwbrand .bnr_bg {
    background-color: #eee;
    padding: 0.5rem 3rem 3rem;
    margin: 0;
  }
  #cwbrand .bnr_tit {
    font-size: 2.2em;
    text-align: center;
    color: #000;
    margin: 0;
    padding: 2rem 0;
  }
  #cwbrand .bnr-wrap div {
    width: calc(100%/3 - 10px);
    margin-right: 10px;
    padding: 0;
  }
  #cwbrand .bnr-wrap div:nth-of-type(3n) {
    margin-right: 0;
  }
  #cwbrand .bnr-wrap div img {
    max-width: 100%;
    height: auto;
  }
  #cwbrand .bnr_txt {
    font-size: 1.2em;
    text-align: left;
    color: #000;
    font-weight: 500;
    margin: 0;
    padding: 0.2rem 0.5rem;
  }
  #cwbrand h3 {
    padding: 0.2rem 0.5rem;
  }
  #cwbrand .bnr_txtS {
    font-size: 0.9rem;
    color: #666;
    padding: 0 0.5rem;
  }
  #cwbrand .bnr-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
    margin: 0;
    justify-content: space-between;
  }
  #cwbrand .bnr-wrap a {
    color: #000;
    text-decoration: none;
  }
  #cwbrand .bnr-wrap a:hover {
    color: #0171a6;
    text-decoration: none;
    transition: all 0.3s;
  }
}
@media screen and (max-width:736px) {
  #cwbrand .sp-none {
    display: none;
  }
  #cwbrand {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    color: #000;
    font-family: "Noto Sans JP";
  }
  #cwbrand .color_bg {
    background-color: #cde4ec;
    margin: 0 calc(50% - 50vw);
    padding: 0;
  }
  #cwbrand h1, #cwbrand h2, #cwbrand h3, #cwbrand p {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
  }
  #cwbrand ul, #cwbrand li, #cwbrand dl, #cwbrand dt, #cwbrand dd {
    /*margin: 0;*/
    list-style: none;
    padding: 0;
  }
  #cwbrand img {
    display: block;
  }
  #cwbrand .conL {
    width: 29%;
    margin: 4% 2%;
  }
  #cwbrand .conL02 {
    width: 29%;
    margin: 2%;
  }
  #cwbrand .kv_area {
    max-width: 1200px;
    margin: 0 auto;
  }
  #cwbrand .h2_tit {
    max-width: 1100px;
    font-size: 1.6em;
    font-weight: 700;
    border-bottom: solid 2px #ebebeb;
    margin: 10% auto 6%;
    padding: 1% 0;
  }
  #cwbrand .board_tit {
    font-size: 1.6rem;
    text-align: center;
    color: #9C6B4C;
    margin: 0;
    padding: 2rem 0;
  }
  #cwbrand .look_tit {
    font-size: 1.5em;
    text-align: center;
    color: #9C6B4C;
    margin: 0;
    padding: 2rem 0;
  }
  #cwbrand .line {
    max-width: 100%;
    border-bottom: solid 2px #ebebeb;
    margin: 0 auto;
    padding-top: 3%;
  }
  #cwbrand section {
    width: 100%;
    margin: 0 auto;
  }
  #cwbrand .cw_logo {
    width: 60%;
    margin: 5% 0%;
    padding: 0;
  }
  #cwbrand .catch {
    width: 95%;
    margin: 9% auto;
    padding: 0;
  }
  #cwbrand .leadLL {
    font-size: 2.74em;
    font-weight: bold;
    letter-spacing: 0.08em;
    margin: 0;
    padding: 0;
  }
  #cwbrand .leadL {
    font-size: 0.95em;
    font-weight: bold;
    /*letter-spacing: 0.09em;*/
    line-height: 2.1em;
    margin: 5% 1.5%;
    padding: 0;
  }
  #cwbrand .leadLC {
    font-size: 0.95em;
    font-weight: bold;
    letter-spacing: 0.09em;
    line-height: 2.1em;
    margin: 2% 1.5%;
    padding: 0;
    text-align: right;
  }
  #cwbrand .leadS {
    font-size: 0.7em;
    margin: 0.2% 0 1% 0;
    padding: 0;
  }
  #cwbrand .leadM {
    font-size: 1.3em;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0;
    padding: 0;
  }
  #cwbrand .leadMM {
    font-size: 0.9em;
    font-weight: bold;
    margin: 0;
    padding: 0;
  }
  #cwbrand .leadM > span {
    font-size: 70%;
  }
  #cwbrand .lead {
    font-size: 0.7em;
    font-weight: bold;
    /*letter-spacing: 0.09em;*/
    line-height: 1.8em;
    margin: 2.5% 0%;
    padding: 0;
  }
  #cwbrand .lead > span {
    font-size: 70%;
  }
  #cwbrand .leadR {
    font-size: 0.6em;
    text-align: right;
  }
  #cwbrand .italic {
    font-style: italic;
  }
  #cwbrand .italicL {
    font-size: 1.8em;
    font-weight: bold;
    letter-spacing: 0.09em;
    margin: 1% 0 0 1.5%;
    padding: 0;
    font-style: italic;
  }
  #cwbrand .italicL > span {
    font-style: normal;
  }
  /*board*/
  #cwbrand .board-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
    justify-content: center;
  }
  #cwbrand .board-wrap div {
    width: calc(100%/1 - 0);
    margin-right: 0px;
    padding: 0; /*←画像の左右余白*/
    box-sizing: border-box;
  }
  #cwbrand .board-wrap div:nth-of-type(4n) {
    margin-right: 0;
  }
  #cwbrand .board-tit {
    color: #9C6B4C;
    font-size: 1.1rem;
    border: solid #9C6B4C;
    border-width: 3px 0 0;
    padding: .8rem 0;
  }
  #cwbrand .board-nam {
    color: #9C6B4C;
    font-size: 3.0rem;
    font-weight: bold;
    text-align: center;
    font-family: Arial, Helvetica, "sans-serif"
  }
  #cwbrand .board-txt {
    color: #9C6B4C;
    font-size: .9rem;
    text-align: left;
    font-weight: 500;
  }
  /*LOOK*/
  #cwbrand .look-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
  }
  #cwbrand .look-wrap div {
    width: calc(100%/2); /*←画像を横に並べる数*/
    padding: 0; /*←画像の左右余白*/
    box-sizing: border-box;
  }
  #cwbrand .look-wrap div img {
    max-width: 100%; /*画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
    /*border: solid 1px #fff; ←画像を1pxのグレーの枠線で囲む指定の場合*/
  }
  /*bnr*/
  #cwbrand .bnr_bg {
    background-color: #eee;
    margin: 0 calc(50% - 50vw);
    padding: 0 1rem 2.5rem;
  }
  #cwbrand .bnr_tit {
    font-size: 1.6em;
    text-align: center;
    color: #000;
    margin: 0;
    padding: 2rem 0 0;
  }
  #cwbrand .bnr-wrap div {
    width: calc(100%/1 - 0px);
    margin-right: 0px;
    padding: 0;
  }
  #cwbrand .bnr-wrap div img {
    max-width: 100%;
    height: auto;
    margin-top: 1.5rem;
  }
  #cwbrand .bnr_txt {
    font-size: 1.2em;
    text-align: left;
    color: #000;
    font-weight: 500;
    margin: 0;
    padding: 0.2rem 0.5rem;
  }
  #cwbrand h3 {
    padding: 0.2rem 0em;
  }
  #cwbrand .bnr_txtS {
    font-size: 0.9rem;
    color: #666;
    padding: 0;
  }
  #cwbrand .bnr-wrap {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    padding: 0;
    margin: 0;
    justify-content: space-between;
  }
  #cwbrand .bnr-wrap a {
    color: #000;
    text-decoration: none;
  }
  #cwbrand .bnr-wrap a:hover {
    color: #0171a6;
    text-decoration: none;
    transition: all 0.3s;
  }
}