@charset "UTF-8";
/* CSS Document */
/*--------------------
01.top
02.tileapplilp01
03.campaign
04.
--------------------*/
@media only screen and (max-width:1024px) {
/*----------
01.top
----------*/
#top .link_txt{
font-size: 12px;
text-align: center;
margin-top: -15px;
}

#top .news_txt.in_cate{
font-size: 22px;
border-top: solid 2px #109D99;
border-bottom: solid 2px #109D99;
}
#top .cnt_box.outlet{
padding-top: 35px;
}
#top .cnt_box.outlet .cnt_txt{
font-size: 14px;
padding-bottom: 40px;
}
#top .cnt_top {
margin-top: 10px;
color: #FFFFFF;
text-align: center;
}
#top .cnt_top h2 {
font-size: 24px;
padding-top: 50px;
line-height: 28px;
}
#top .cnt_top .flex_box {
display: block;
padding: 70px 0 30px;
}
#top .cnt_top .cnt_video {
max-width: 500px;
margin: 30px auto 0;
padding: 0 10px;
}
#top .cnt_top .cnt_video p {
text-align: center;
font-size: 14px;
padding-top: 10px;
}
#top .cnt_top .cnt_img {
max-width: 900px;
padding: 0 10px;
margin: 0 auto;
}
#top .cnt_box {
padding-top: 40px;
padding-bottom: 40px;
}
#top .cnt_box:last-child {
padding-bottom: 40px;
}
#top h3 {
font-size: 20px;
line-height: 24px;
position: relative;
text-align: center;
}
#top h3:before {
content: '';
position: absolute;
left: 50%;
bottom: -20px; /*線の上下位置*/
display: inline-block;
width: 40px; /*線の長さ*/
height: 3px; /*線の太さ*/
background-color: #109D99; /*線の色*/
border-radius: 2px; /*線の丸み*/
transform: translateX(-50%)
}
#top .cnt_box .flex_box {
display: flex;
max-width: 355px;
margin: 40px auto;
}
#top .cnt_box .set_box {
margin: 50px auto 40px; 
}
#top .cnt_box .sale_box::before {
width: 60px;
height: 60px;
}
#top .item_box .cnt_img.medal_logo::before{
font-size: 12px;
}
#top .cnt_box .flex_box .caution {
font-size: 12px;
}
#top .cnt_box .item_box {
width: 165px;
background-color: #FFFFFF;
border-radius: 5px;
margin: 0 5px 10px;
padding: 10px;
}
#top .cnt_box .item_box:last-child {
margin: 0 0 10px 5px;
}
#top .item_box .cnt_img {
height: 120px;
}
#top .item_box.sale_box .cnt_img {
height: 135px;
}
#top .item_box .title {
width: 155px;
height: 80px
}

#top #product_05 .item_box .title{
  padding-top: 8px;
}

#top #product_08 .item_box .title{
  padding-top: 10px;
}


#top .item_box .title p {
font-size: 16px;
line-height: 28px;
}
#top .item_box .title p span {
background-color: #F7F7F7;
font-size: 12px;
line-height: 17px;
padding: 5px 4px;
margin-top: 10px;
}
#top .item_box .title_02 p {
font-size: 16px;
line-height: 35px;
}
#top .item_box .title_02 p span {
background-color: #F7F7F7;
font-size: 12px;
line-height: 17px;
padding: 5px 4px;
margin-top: 10px;
}
#top .item_box .btn_box .menu {
font-size: 12px;
margin-bottom: 15px;
line-height: 18px;
}
#top .item_box .btn_box .menu span {
font-size: 15px;
}
#top .item_box .btn_box .price {
font-size: 16px;
}
#top .item_box .btn_box .pack_p {
font-size: 14px;
}
#top .item_box .btn_box .price span {
font-size: 12px;
}
#top .item_box .btn_box .price.sale_p{
font-size: 12px;
}
#top .item_box .btn_box .price.sale_p span{
font-size: 10px;
}
#top .item_box .btn_box::after {
right: -120px;
width: 10px;
height: 10px;
border-top: 1px solid #109D99;
border-right: 1px solid #109D99;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
#top #case_area .case_box .title_area p {
font-size: 14px;
line-height: 20px;
text-align: center;
color: #FFFFFF;
padding: 10px 0;
}
#top #case_area .case_box .title_area p span {
font-size: 16px;
line-height: 30px;
}
#top #case_area .case_box .white_area {
padding: 20px;
}
#top #case_area .case_box .cnt_img {
width: 260px;
margin: 0 auto;
}
#top #case_area .case_box .cnt_text {
margin-top: 15px;
}
#top #case_area .case_box .cnt_text p {
color: #109D99;
font-size: 14px;
line-height: 28px;
}
#top #case_area .cnt_txt{
margin-top: -30px;
font-size: 12px;
}
#top #comparison_area {
padding: 51px 0 65px;
margin: 0 0 50px;
background: #F7F7F7;
}
#top #comparison_area .contents_in {
max-width: 1160px;
}
#top #comparison_area .horizontal-list {
overflow-x: auto;
white-space: nowrap;
display: flex;
}
#top #comparison_area table {
box-sizing: border-box;
border: 1px solid #bbb;
width: 100%;
margin: 0 auto;
background: #fff;
font-size: 14px;
line-height: 30px;
position: relative;
}
#top #comparison_area .table_box {
padding-top: 40px;
}
#top #comparison_area th {
border: 1px solid #bbb;
text-align: center;
font-weight: normal;
padding: 9px 0;
line-height: 20px;
box-sizing: border-box;
}
#top #comparison_area th span {
line-height: 20px;
}
#top #comparison_area .bg_blue {
background-color: #109D99;
color: #FFFFFF;
}
#top #comparison_area .color01 {
background: #EFEFEF;
padding: 18px 0 16px 20px;
text-align: left;
}
#top #comparison_area .cnt_img {
width: 100px;
margin: 0 auto;
}
#top #comparison_area td {
border: 1px solid #bbb;
line-height: 19px;
font-weight: normal;
padding: 18px 0 16px;
vertical-align: middle;
text-align: center;
}
#top #comparison_area td span {
display: block;
font-size: 13px;
padding: 10px 0 0;
}
#top #comparison_area .th01 {
min-width: 150px;
}
#top #comparison_area .th02 {
min-width: 150px;
line-height: 14px;
padding: 0px 0 18px;
}
#top #comparison_area .th03 {
min-width: 150px;
line-height: 14px;
padding: 0px 0 18px;
}
#top #comparison_area .th04 {
min-width: 150px;
line-height: 14px;
padding: 0px 0 18px;
}
#top #comparison_area .th05 {
min-width: 150px;
line-height: 14px;
padding: 0px 0 18px;
}
#top #comparison_area .th06 {
min-width: 150px;
line-height: 14px;
padding: 0px 0 18px;
}
#top #designtile_area {
padding: 60px 0 26px;
margin: 0 0 66px;
}
#top #designtile_area .contents_in {
max-width: 1160px;
}
#top #designtile_area .cnt_g {
display: flex;
justify-content: space-between;
align-items: center;
}
#top #designtile_area .cnt_g .cnt_img {
display: block;
width: 50%;
margin: 0 auto;
}
#top #designtile_area .cnt_g .cnt_img .img {
max-width: 460px;
width: 100%;
}
#top #designtile_area .cnt_g .cnt_img img {
width: 100%;
}
#top #designtile_area .cnt_g .cnt_right {
width: 50%
}
#top #designtile_area .cnt_g .cnt_text {
display: block;
position: relative;
padding: 30px;
box-sizing: border-box;
}
#top #designtile_area .cnt_g .cnt_text::after {
content: '';
display: block;
width: 100%;
height: 100%;
background: #f7f7f7;
position: absolute;
top: 0;
right: 0;
z-index: -1;
}
#top #designtile_area p {
font-size: 14px;
line-height: 27px;
color: #333;
}
#top #designtile_area .btn_more {
max-width: 240px;
width: 100%;
margin: 20px auto 20px;
}
#top #designtile_area .btn_more a {
font-family: 'UD新ゴ B', sans-serif;
display: inline-block;
width: 100%;
border-radius: 5px;
background: #109D99;
text-align: center;
padding: 18px 0 17px;
font-size: 16px;
color: #fff;
}

/*----------
02.tileapplilp01
----------*/
#tileapplilp01 .cnt_box .sale_box::before {
width: 50px;
height: 50px;
}

}
@media only screen and (max-width:750px) {
/*----------
01.top 750
----------*/
/* #top .main_visual .slick-dots li.slick-active button{
  background-color: transparent;
}

#top .main_visual .slick-dots button {
    text-align: center;
    line-height: 12px;
        margin-right: 10px;
        width: 100%;
        height: 100%;
            padding: 0;
}



#top .main_visual .slick-dots li {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
} */

#top .mv .slick-arrow{
width: 35px;
height: 35px;
}

#top .mv .slick-next{
  right: 5%;
}

#top .mv .slick-prev{
  left: 5%;
}

#top .mv .sp{
  display: block;
}

#top .mv .pc{
  display: none;
}

#top .mv .slick-slide {
  margin: 0 5px;
}
#top #designtile_area .btn_more a {
font-family: 'UD新ゴ B', sans-serif;
display: inline-block;
width: 100%;
border-radius: 5px;
background: #109D99;
text-align: center;
padding: 18px 0 17px;
font-size: 16px;
color: #fff;
}
#top #model_area .model_box {
display: flex;
flex-wrap: wrap;
border: solid #109D99 1px;
margin: 0 10px 20px;
width: 335px;
}
#top #model_area .flex_wrap .flex_box {
flex-wrap: wrap;
justify-content: center;
}
#top #model_area .model_box .cnt_img {
width: 155px;
}
#top #model_area .model_box .cnt_text {
padding: 10px 0 0 10px;
background-color: #FFFFFF;
}
#top #model_area .model_box .model_title {
font-size: 16px;
line-height: 22px;
padding-bottom: 10px;
}
#top #model_area .model_box .model_text {
display: flex;
font-size: 12px;
line-height: 16px;
padding-top: 0px;
}
#top #model_area .model_box .model_text p {
margin-top: 5px;
}
#top #model_area .model_box .model_text .cnt_img {
width: 45px;
margin: 5px 0 0 10px;
}
#top h3{
  line-height: 28px;
}
#top #select_from_series .cnt_box .item_box{
  margin: 0 auto 20px;
  width: 100%;
}

#top #select_from_series .cnt_box .flex_box ul{
  width: 100%;
}


#top .mv .link {
    right: 0;
    left: 0;
    height: 21%;
    min-height: auto;
}


#top .mv .link01{
  top: 39.8%;
  width: 100%;
  max-width: initial;
}

#top .main_visual .slick-dots button{
  display: block;
}

#top .mv .link02{
  top: auto;
  bottom: 0;
  width: 100%;
  max-width: initial;
}
/*----------
02.tileapplilp01
----------*/
#tileapplilp01 .h3_ptn02 {
font-size: 18px;
}

#tileapplilp01 .coupon_area .cnt_coupon .txt {
font-size: 20px;
}

#tileapplilp01 .coupon_area .cnt_coupon {
margin: 20px auto;
padding: 1rem;
width: 100%;
}

#tileapplilp01 .coupon_area .cnt_coupon::after{
position: absolute;
content: '';
left: -15px;
width: 90px;
height: 90px;
transform: rotate(-40deg);
}

#tileapplilp01 .coupon_area .cnt_coupon .txt span.coupon_num {
color: #000;
font-size: 22px;
}

#tileapplilp01 .coupon_area .cnt_coupon .txt span.caution {
font-size: 12px;
}

#tileapplilp01 .coupon_area .btn_add {
padding: 15px 0;
}

#tileapplilp01 .recommend_area {
padding: 40px 0 30px;
text-align: center;
}

#tileapplilp01 .recommend_list .item_box .title {
height: 80px;
}

#tileapplilp01 .recommend_list .item_box .title p {
font-size: 16px;
line-height: 28px;
}

#tileapplilp01 .recommend_list .item_box .btn_box .menu{
font-size: 12px;
margin-bottom: 15px;
line-height: 18px;
}

#tileapplilp01 .recommend_list .item_box .btn_box .price{
font-size: 16px;
}

#tileapplilp01 .recommend_list .item_box .btn_box::after {
right: -160px;
width: 10px;
height: 10px;
border-top: 1px solid #109D99;
border-right: 1px solid #109D99;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

#tileapplilp01 .area{
padding: 30px 20px;
}

#tileapplilp01 .tab li.active a {
padding: 10px 20px 13px 20px;
border-top: 3px solid #109D99;
}

#tileapplilp01 .tab li a {
padding: 13px 20px;
font-size: 16px;
}

#tileapplilp01 #amazon .cnt_g .item .cnt_txt {
font-size: 14px;
}
#tileapplilp01 #amazon .cnt_link_img{
  max-width: 220px;
  }

#tileapplilp01 #amazon .cnt_g .item .cnt_txt span {
font-size: 14px;
}

#tileapplilp01 #amazon .cnt_g .item .cnt_txt .btn_link {
margin-top: 5px;
padding: 8px 10px;
font-size: 14px;
}

/*----------
03.campaign
----------*/
#campaign h2{
  font-size: 18px;
}

#campaign h2 .mini{
  font-size: 14px;
  display: inline-block;
}

#campaign .flex_box{
flex-direction: column;
}

#campaign .flex_box .cnt_box{
  max-width: 335px;
}

#campaign .flex_box .cnt_box, #campaign .flex_box .cnt_box:first-child{
margin: 0 auto 20px;
}

#campaign .flex_box .cnt_box::before{
font-size: 14px;
}

#campaign .flex_box .cnt_box .title{
  font-size: 18px;
}

#campaign .flex_box .price_top{
  font-size: 14px;
}

#campaign .flex_box .price_top .tax{
  font-size: 12px;
}

#campaign .flex_box .price{
  font-size: 16px;
}

#campaign .flex_box .price span{
  font-size: 14px;
}

#campaign .btn_add p{
  font-size: 14px;
}

#campaign .btn_add p::before{
  width: 20px;
  height: 12px;
}
#campaign .caution{
  font-size: 12px;
}
}

@media only screen and (max-width:425px) {
#top #case_area .case_box{
  width: 94%;
  margin: 0 0 30px;
}

/*----------
02.tileapplilp01
----------*/
#tileapplilp01 .recommend_list .item_box {
margin: 0 auto 20px auto;
padding: 15px;
text-align: left;
}
}

@media only screen and (max-width:374px) {
  #top .cnt_box .flex_box ul{
    justify-content: center;
  }

#top .cnt_box#product_02 .flex_box {
    justify-content: center;
}

/*----------
03.campaign
----------*/
#campaign .flex_box .cnt_box::before{
  left: -5px;
}

#campaign .flex_box .cnt_box{
  max-width: 300px;
}

#campaign .flex_box .price_top{
  font-size: 13px;
}

#campaign .caution{
  font-size: 11px;
}
}