@charset "UTF-8";

/*　共通　**********************************/

p,ul,ol,li,dl,dt,dd{
    padding: 0;
    margin: 0;
}

.SpOnly{
    display: none;
}


/*　パンくず部分調整　**********************************/

.BreadCrumb--Adjustment {
    margin: 0 0 8px;
}


/*　Header　**********************************/

/*　タイトル部分背景 */
.Header{
    width: auto;
    height: 296px;
    text-align: center;
    background-image: url("//jp.images-monotaro.com/etc/merchandising/common/car_mainte-topback.png");
    box-shadow: 0 8px 8px -8px rgb(0 0 0 / 16%), 0 -4px 4px -4px rgb(0 0 0 / 16%);
}
.PageSummary{
    position: relative;
    max-width: 1142px;
    height: 296px;
    margin: 0 auto;
    line-height: 1;
    background-image: url("//jp.images-monotaro.com/etc/merchandising/MaskingTapeForCarPainting/MaskingTapeCar-TopImage-pc.png");
}

/*　タイトル全体 */
.PageTitle{
    padding: 32px 0;
}

/*　シリーズ名 */
.PageTitle__Series{
    display: inline-block;
    padding: 8px;
    margin: 0 0 16px;
    color: #fff;
    font-size: 22px;
    background-color: #005898;
    border-radius: 8px;
}
.PageTitle__SeriesSmall{
    padding: 0 4px;
    font-size: 19px;
}

/*　タイトル名 */
.PageTitle__Main{
    display: inline-block;
    color: #005898;
    font-size: 40px;
}

/*　シリーズ説明 */
.PageSummary__Attach{
    font-size: 19px;
    font-weight: bold;
}

/*　車画像 */
.PageSummary__Image{
    position: absolute;
    bottom:8px;
    left: 459px;
    width: 224px;
    height: auto;
}


/* Headerより後のコンテンツ部分　**********************************/

/*　全体(背景色を全体に広げるために設定) */
.Wrapper{
    overflow: hidden;
}

/*　全体 */
.ArticleContents{
    max-width: 1140px;
    margin: 0 auto;
    font-size: 13px;
    line-height: 1.3;
}

/*　コンテンツ部分全体（PC右） */
.Main{
    float: right;
    max-width: 912px;
}

/*　背景色を全体に広げる */
.BackColorWide{
    margin: 0 -200%;
    padding: 0 200%;
}
/*　マスキングテープの基礎知識（水色背景部分） */
.BackColorWide--Knowledge{
    background-color: #e6f4fa;
}
/*　マスキングテープの選び方(クリーム背景部分) */
.BackColorWide--Select{
    background-color: #fefbee;
}

/*　イントロダクション・基礎知識・選び方　各全体 */
.ContentsBox{
    display: inline-block;
    width: 100%;
    padding: 72px 0;
}


/*　導入部分　****************************/

.LeadSentence{
    display: inline-block;
    width: 100%;
    margin: 16px 0 0;
    text-align: center;
}

/*　吹き出し(お困りではありませんか)部分 */
.Introduction{
    position: relative;
    display: inline-block;
    width: 800px;
    margin: 0 auto 32px;
    padding: 16px;
    background-color: #005898;
    border-radius: 8px;
}
.Introduction:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -16px;
  border: 16px solid transparent;
  border-top: 16px solid #005898;
}
.Introduction__Icon{
    position: absolute;
    width: 32px;
    height: auto;
    margin: -4px 0 0 -38px;
}
.Introduction__Contents{
    margin: 0 0 0 38px;
    color: #fff;
    font-size: 19px;
    font-weight: bold;
}

/*　イントロダクション　テキスト */
.LeadSentence__Main{
    margin: 0 0 56px;
    font-size: 22px;
    line-height: 1.5;
}
.LeadSentence__MainEmphasis{
    font-weight: bold;
    background:linear-gradient(transparent 60%, #fbf2a4 40%);
}


/*　ページ内リンク ****************************/

.ContentsNavi{
    display: inline-block;
    width: 864px;
    margin: 0 auto;
}

/*　各リンク */
.ContentsNavi__Link{
    position: relative;
    float: left;
    width: 272px;
    height: 144px;
    padding: 16px;
    margin: 0 24px 0 0;
    text-decoration: none;
    box-sizing: border-box;
    border-radius: 8px;
}
.ContentsNavi__Link:visited {
    color: #333;
}
.ContentsNavi__Link:last-child{
    margin: 0;
}
.ContentsNavi__Link--Knowledge{
    background-color: #e6f4fa;
    border: #005898 solid 3px;
}
.ContentsNavi__Link--Select{
    background-color: #fefbee;
    border: #f5df1d solid 3px;
}

/*　タイトル */
.ContentsNavi__Title{
    padding: 8px 0;
    margin: 0 0 8px;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    line-height: 1;
    background-color: #fff;
    border-radius: 8px;
}

/*　リンク先の内容説明 */
.ContentsNavi__Explanation{
    text-align: left;
}

/*　アイコン */
.Icon--ContentsNavi{
    position: absolute;
    bottom: 8px;
    left: 50%;
    right: 50%;
    margin: 0 0 0 -4px;
}


/*　基礎知識・選び方　タイトル ****************************/

.ContentsBox__Title{
    margin: 0 0 48px;
    text-align: center;
    font-size: 32px;
    font-weight: bold;
}


/* 基礎知識 ****************************/

.Knowledge{
    float: left;
    width: 424px;
    margin: 0 40px 0 0;
}
.Knowledge:last-child{
    margin: 0;
}

/*　タイトル */
.Knowledge__Title{
    margin: 0 0 24px;
    color: #005898;
    font-size: 15px;
}


/* マスキングテープの構造 ************/

/*　テキスト */
.Knowledge__Explanation{
    margin: 0 0 8px;
}
/*　冒頭に※ありテキスト */
.Knowledge__Reference {
    margin: 1em;
    text-indent: -1em;
}

/*　リスト（マスキングテープは~　1-3） */
.Knowledge__List{
    margin: 0 0 8px;
    list-style: none;
}
.Knowledge__Item {
    margin: 0 0 4px;
}

/*　画像 */
.Knowledge__Image{
    width: 392px;
    height: auto;
    padding: 16px;
    margin: 0 0 16px;
    background-color: #fff;
    box-sizing: border-box;
}


/* 基材別の特徴と性能 ************/

/*　表全体 */
.Table--Knowledge{
    width: 100%;
    background-color: #fff;
}
/*　左th調整 */
.Table__HeadCell--Knowledge{
    background: none;
}


/* 選び方 ****************************/

.Select{
    width: 896px;
    padding: 0 0 40px;
    margin: 0 0 40px;
    background-color: #fff;
}

/*　タイトル */
.Select__Title{
    padding: 16px 24px;
    margin: 0 0 40px;
    font-size: 22px;
    font-weight: bold;
    background-color: #f5df1d;
}

/*　に使用する～商品紹介　全体 */
.SceneEach{
    padding: 0 0 40px;
    margin: 0 16px 40px;
    border-bottom: #ccc solid 1px;
}
.SceneEach:last-child{
    padding: 0;
    margin: 0 16px 0;
    border: none;
}


/* 用途別に選ぶ ****************************/

/*　に使用する **********/

.Scene{
    min-height: 120px;
    padding: 0 0 0 136px;
    margin: 0 24px 32px;
    background-size: 120px 120px;
    background-repeat: no-repeat;
}
/*　直線部分 */
.Scene--Straight{
    background-image: url("//jp.images-monotaro.com/etc/merchandising/MaskingTapeForCarPainting/MaskingTapeCar-straight.png") ;
}
/*　曲線部分 */
.Scene--Curve{
    background-image: url("//jp.images-monotaro.com/etc/merchandising/MaskingTapeForCarPainting/MaskingTapeCar-curve.png") ;
}
/*　隙間埋め */
.Scene--Softtape{
    background-image: url("//jp.images-monotaro.com/etc/merchandising/MaskingTapeForCarPainting/MaskingTapeCar-softtape.png") ;
}

/*　タイトル */
.Scene__Title{
    margin: 0 0 16px;
    color: #cb5800;
    font-size: 19px;
    font-weight: bold;
}

/*　YouTube **********/

.Movie{
  margin: 0 auto 40px;
  text-align: center;
}

/*　タイトル */
.Movie__Title{
  font-weight: bold;
  padding: 0 0 8px;
  margin: 0;
}

/*　動画 */
.Movie__Enclosure {
     position: relative;
     width: 560px;
     height: 315px;
     margin: 0 auto;
     overflow: hidden;
}
.Movie__Iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     border: none;
}

/*　おすすめ商品紹介 **********/

.ProductBox{
    display: inline-block;
    width: 816px;
    margin: 0 24px 32px;
}
.ProductBox:last-child {
    margin: 0 24px 0;
}

/*　商品　各 */
.Product {
    float: left;
    width: 180px;
    margin: 0 32px 0 0;
    line-height: 1.3;
}
.Product:last-child {
    margin: 0;
}

/*　商品画像 */
.Product__ImageLink{
    display: inline-block;
    width: 180px;
    height: 180px;
    margin: 0 0 8px;
    text-align: center;
    border: #e6e6e6 solid 1px;
    background-color: #fff;
}
.Product__ImageLink:hover, .Product__ImageLink:active {
    opacity: 0.6;
}
.Product__Image{
    width: 180px;
    height: auto;
    padding: 16px;
}

/*　商品名 */
.Product__Name{
    height: 40px;
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: bold;
}

/*　ブランド名 */
.Product__Brand{
    margin: 0 0 8px;
}

/*　商品説明 */
.Product__Point{
    height: 48px;
    margin: 0 0 16px;
}

/* 価格 */
.Product__Price{
  color: #df0011;
  font-size: 19px;
  font-weight: bold;
}
.Product__PriceEn{
  font-size: 13px;
}
.Product__TaxIncludedPriceEn{
  font-size: 11px;
}
.Product__TaxIncludedPrice:after{
  content: " 税込";
}

/* もっと見る */
.MoreProduct{
    text-align: center;
}
.MoreProduct__Button{
    width: 384px;
}


/* お困りごと別に選ぶ ****************************/

.TroubleIntroduction{
    margin: 0 40px 40px;
}
.TroubleBox{
    display: inline-block;
    margin: 0 40px;
}

/* お困りごと　各 **********/

.Trouble{
    float: left;
    width: 250px;
    margin: 0 32px 32px 0;
    border: #e6e6e6 solid 1px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 16%);
    box-sizing: border-box;
}
.Trouble:nth-child(3n){
    margin-right: 0;
}
.Trouble:nth-child(n+4){
    margin-bottom: 0;
}

/* リンク */
.Trouble__Link {
    display: block;
    padding: 16px;
    text-decoration: none;
}
.Trouble__Link:link, .Trouble__Link:visited {
    color: #333;
}
.Trouble__Link:hover, .Trouble__Link:active{
    opacity: 0.6;
}

/* お困りごと（グレー背景） */
.Trouble__Question{
    position: relative;
    height: 72px;
    padding: 16px 0;
    margin: -16px -16px 32px;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    background-color: #e6e6e6;
    border-radius: 8px 8px 0 0;
}
.Trouble__Question:before{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -16px;
  border: 16px solid transparent;
  border-top: 16px solid #e6e6e6;
}

/* 解決のおすすめ性能 */
.Trouble__Anser{
    min-height: 48px;
    padding: 0 0 0 56px;
    margin: 0 0 24px;
    color: #cb5800;
    font-size: 19px;
    font-weight: bold;
    background-size: 48px 48px;
    background-repeat: no-repeat;
}
.Trouble__Anser:after{
    content: "テープがおすすめ！";
    display: block;
    color: #333;
    font-size: 13px;
    font-weight: normal;
}
/* 汎用性が高い */
.Trouble__Anser--General{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono22567177-160428-02.jpg") ;
}
/* 耐候性が高い */
.Trouble__Anser--Weather{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono06775684-201030-02.jpg") ;
}
/* 巻き出しが軽い */
.Trouble__Anser--Roll{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono31376677-160912-02.jpg") ;
}
/* 伸縮性が高い */
.Trouble__Anser--Elasticity{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono10713647-090108-02.jpg") ;
}
/* 直線性が高い */
.Trouble__Anser--Straight{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono09570443-220526-02.jpg") ;
}
/* 初期接着力が高い */
.Trouble__Anser--Adhesion{
    background-image: url("//jp.images-monotaro.com/Monotaro3/pi/full/mono26921807-161014-02.jpg") ;
}

/* 「商品一覧を見る」ボタン */
.Trouble__Button{
    width: 100%;
}


/* Topic ****************************/

.Topic{
    width: 896px;
    padding: 40px;
    background-color: #e6f4fa;
}
/* タイトル */
.Topic__Title{
    margin: 8px 0 48px;
    color: #005898;
    font-size: 19px;
    font-weight: bold;
}
.Topic__Icon{
    padding: 4px 8px;
    margin: 0 8px 0 0;
    color: #fff;
    background-color: #005898;
}

/* Topic内コンテンツ　各 */
.TopicContents{
    margin: 0 0 40px;
}
.TopicContents:last-child{
    margin: 0;
}

/* Topic内 タイトル */
.TopicContents__Title{
    margin: 0 0 16px;
    font-size: 15px;
    font-weight: bold;
}


/* 見直してみませんか？　**********/

/* 画像 */
.TopicContents__Image{
    display: block;
    width: 568px;
    height: 334px;
    padding: 24px 40px;
    margin: 24px auto 0;
    background-color: #fff;
    box-sizing: border-box;
}


/* Topic商品紹介　**********/
.ProductBox--Topic{
    width: 774px;
    margin: 0 40px
}
.Product--Topic{
    width: 226px;
    margin: 0 48px 0 0;
}
.Product--Topic:last-child {
    margin: 0;
}
.Product__ImageLink--Topic{
    width: 226px;
}



/*　製品を選ぶ（PCでは左サイド） 　**********************************/

.ChoiceBox{
    float: left;
    width: 180px;
    padding: 0 0 5016px;
    margin: 32px 0 0 0;
    background-color: #fff;
    border: #ccc solid 1px;
    border-radius: 8px;
    box-sizing: border-box;
}

/* 「製品を選ぶ」 */
.ChoiceBox__Title{
    padding: 16px;
    font-size: 15px;
    font-weight: bold;
    background-color: #ccc;
    border-radius: 8px 8px 0 0;
}

/* 「～から選ぶ」　**********/

.ChoiceBox__Bundle{
    padding: 0 0 8px;
    margin: 16px 8px;
    border-bottom: #ccc solid 1px;
}

/* タイトル */
.ChoiceTitle{
    margin: 0 0 16px;
    font-size: 13px;
    font-weight: bold;
    line-height: 1;
}
/* タイトル　前のアイコン */
.ChoiceTitle__Icon{
    display: none;
}

/*　選択肢一覧 */
.ChoiceList{
    display: inline-block;
    margin: 0 0 0 8px;
    list-style: none;
}

/*　選択肢各種 */
.ChoiceList__Item{
    padding: 0 0 8px 0;
    margin: 0 0 0 1em;
    text-indent: -1em;
}
.ChoiceList__Link:visited {
    color: #333;
}

/*　選択肢各種 後ろのアイコン(SPのみ) */
.ChoiceList__SpRight {
    display: none;
}



/*////////////////////////////// for SP (max-width:767px & max-width:896pxかつSP横向き) //////////////////////////////*/
@media screen and (max-width: 767px) , screen and (max-width: 896px) and (orientation: landscape) {

/*　スタイルガイド流用　**********************************/

/*　アイコン */
@font-face {
    font-family: "monotaroIcon";
    src: url("/fonts/monotaroIcon.eot?v=c7502c853a958c880505ff312d10b137");
    src: url("/fonts/monotaroIcon.eot?v=c7502c853a958c880505ff312d10b137") format("embedded-oPentype"), url("/fonts/monotaroIcon.ttf?v=c7502c853a958c880505ff312d10b137") format("truetype"), url("/fonts/monotaroIcon.woff?v=c7502c853a958c880505ff312d10b137") format("woff"), url("/fonts/monotaroIcon.svg?v=c7502c853a958c880505ff312d10b137") format("svg");
    font-weight: normal;
    font-style: normal; }
[class*="Icon--"],
[class*="Icon--"]:after,
[class*="Icon--"]:before {
    font-family: "monotaroIcon" !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.Icon--SortDown:before {
    content: "\e903";
}
.Icon--AngleDown:before {
    content: "\e92d";
}
.Icon--AngleRight:before {
  content: "\e91b";
}
.Icon--Plus:before {
  content: "\e936";
}
.Icon--Close:before {
  content: "\e91e";
}
.Icon--ExclamationCircle:before {
  content: "\e924";
}

/*　ボタン */
.Button{
  position: relative;
  min-width: 64px;
  margin: 0;
  padding: 0 16px;
  font-weight: 500;
  border-radius: 4px;
  color: #333;
  background-color: #fff;
  border: 1px solid #b3b3b3;
  -webkit-box-shadow: inset 0 -1px 0 0 #b3b3b3;
          box-shadow: inset 0 -1px 0 0 #b3b3b3;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  -webkit-user-select: none;
  -moz-user-select: none;
   -ms-user-select: none;
       user-select: none;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}
.Button--Lg {
    height: 48px;
    font-size: 15px;
    line-height: 24px;
}
.Button--Md {
    height: 36px;
    font-size: 13px;
    line-height: 18px;
}
.Button--Secondary{
    color: #333;
    background-color: #f1f1f1;
}

/*　テキストリンク */
.TextLink__Text:link { /*　styleguideでは　TextLink__Text */
    text-decoration: underline;
}
.TextLink__Icon--Left{
    padding-right: 4px;
}

/*　表 */
.Table__Row {
    border-bottom: 1px solid #e6e6e6;
    vertical-align: top;
}
.Table__Row--Zebra:nth-child(2n-1) {
  background-color: #fafafa;
}
.Table__Header {
  padding: 6px 8px;
  background-color: #fafafa;
  border-bottom: 1px solid #b3b3b3;
  color: #333;
  font-weight: 400;
  text-align: left;
}
.Table__Header:first-child {
    border-right: 1px solid #b3b3b3;
}
.Table__Header--Left {
  border-right: 1px solid #b3b3b3;
  border-bottom: none;
}
.Table__Data {
    padding: 6px 8px;
}


/*　パンくず */
.SideScrollArea {
  position: relative;
  overflow-x: scroll;
  overflow-y: hidden;
  padding: 0 12px;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}
.SideScrollGradient {
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 100%;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(79%, white), to(white));
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 79%, white 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 79%, white 100%);
  z-index: 1;
 }
.SideScrollGradient--Left{
  left: 0;
  background: -webkit-gradient(linear,right top,left top,from(hsla(0,0%,100%,0)),color-stop(79%,#fff),to(#fff));
  background: -o-linear-gradient(right,hsla(0,0%,100%,0) 0,#fff 79%,#fff 100%);
  background: linear-gradient(270deg,hsla(0,0%,100%,0) 0,#fff 79%,#fff);
}
.Breadcrumb {
  padding: 12px 0;
  width: 100%;
  min-width: 320px;
  font-size: 11px;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}
.Breadcrumb__Item {
  display: inline-block;
  position: relative;
  margin-right: 12px;
  padding-right: 12px;
 }
.TextLink--Breadcrumb:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 6px;
  height: 6px;
  border-right: 1px solid #b3b3b3;
  border-top: 1px solid #b3b3b3;
  -webkit-transform: rotate(45deg) translateY(-50%);
      transform: rotate(45deg) translateY(-50%);
}

/*　スタイルガイド流用ここまで　**********************************/



/*　共通　*********************************/

.PcOnly{
    display: none;
}
.SpOnly{
    display: block;
}


/*　パンくず　**********************************/

.TextLink--Underline:link{
  text-decoration: underline;
}


/*　Header(タイトル部分)　**********************************/

/*　タイトル部分背景 */
.Header{
    height: 248px;
}
.PageSummary{
    width: auto;
    height: 248px;
    background: url("//jp.images-monotaro.com/etc/merchandising/MaskingTapeForCarPainting/MaskingTapeCar-TopImage-sp.png") center 0 / 625px 248px no-repeat;
}

/*　タイトル全体 */
.PageTitle{
    padding: 24px 0 16px;
}

/*　シリーズ名 */
.PageTitle__Series{
    padding: 4px 8px;
    margin: 0 0 12px 0;
    color: #fff;
    font-size: 13px;
}
.PageTitle__SeriesSmall{
    font-size: 13px;
}

/*　タイトル名 */
.PageTitle__Main{
    font-size: 22px;
    line-height: 1.3;
}

/*　ページ説明 */
.PageSummary__Attach{
    font-size: 13px;
}

/*　車画像 */
.PageSummary__Image{
    left: 50%;
    right: 50%;
    width: 208px;
    margin: 0 0 0 -104px;
}


/* Header より後の部分　**********************************/

.ArticleContents{
    width: auto;
    margin: 0 0 16px 0;
}

/*　コンテンツ部分全体（PC右） */
.Main{
    float: none;
    width: auto;
    margin: 0 0 32px 0;
}

/*　背景色を全体に広げる */
.BackColorWide{
    margin: 0;
    padding: 0;
}

/*　イントロダクション・基礎知識・選び方　各全体 */
.ContentsBox{
    padding: 32px 12px;
    box-sizing: border-box;
}


/*　導入部分****************************/

.LeadSentence{
    width: auto;
    margin: 8px 0 0;
}


/*　吹き出し(お困りではありませんか)部分 */
.Introduction{
    width: auto;
    max-width: 336px;
    padding: 12px;
    margin: 0 auto 24px;
}
.Introduction__Icon{
    display: block;
    position: static;
    width: 24px;
    margin: 0 auto 8px;
}
.Introduction__Contents{
    margin: 0;
    font-size: 15px;
}

/*　イントロダクション　テキスト */
.LeadSentence__Main{
    margin: 0 0 24px 0;
    font-size: 18px;
    text-align: left;
    line-height: 1.5;
}
.LeadSentence__MainEmphasis {
    background: linear-gradient(transparent 70%, #fbf2a4 40%);
}


/*　ページ内リンク ****************************/

.ContentsNavi{
    width: auto;
}

/*　各リンク */
.ContentsNavi__Link{
    width: auto;
    max-width: 400px;
    height: 128px;
    padding: 12px;
    margin: 0 4px 12px;
}
.ContentsNavi__Link:last-child{
    margin: 0;
}

/*　タイトル */
#sp_page_topic #main .ContentsNavi__Title {
    width: 226px;
    padding: 4px 0;
    margin: 0 auto 12px;
    color: #333;
    font-size: 15px;
    background: none;
    background-color: #ffffff;
    border: none;
}


/*　基礎知識・選び方　タイトル ****************************/

#sp_page_topic #main .ContentsBox__Title {
    font-size: 22px;
    font-weight: bold;
    padding: 0;
    margin: 0 0 32px;
    border: none;
    color: #333;
    background: none;
}


/* 基礎知識 ****************************/

.Knowledge{
    float: none;
    width: auto;
    margin: 0 0 32px;
}
.Knowledge:last-child{
    margin: 0;
}

/*　タイトル */
#sp_page_topic #main .Knowledge__Title {
    color: #005898;
    font-size: 15px;
    font-weight: bold;
    padding: 0;
    margin: 0 0 12px;
    border: none;
}

/*　リンク */
.Knowledge__Link{
  text-decoration: underline;
}


/* マスキングテープの構造 ************/

/*　画像 */
.Knowledge__Image{
    width: 100%;
    max-width: 400px;
}


/* 選び方 ****************************/

.Select{
    width: auto;
    padding: 0 12px;
    margin: 0 0 24px;
}

/*　タイトル */
#sp_page_topic #main .Select__Title{
    padding: 12px;
    margin: 0 -12px 32px;
    color: #333;
    font-size: 18px;
    font-weight: bold;
    border: none;
}

/*　に使用する～商品紹介　全体 */
.SceneEach{
    padding: 0 0 32px;
    margin: 0 0 32px;
}
.SceneEach:last-child{
    padding: 0;
    margin: 0;
}


/* 用途別に選ぶ ****************************/

/*　に使用する **********/

.Scene{
    min-height: 80px;
    padding: 0 0 0 88px;
    margin: 0 0 24px;
    background-size: 80px 80px;
}

/*　タイトル */
#sp_page_topic #main .Scene__Title {
    padding: 0;
    margin: 0 0 8px;
    color: #cb5800;
    font-size: 15px;
    font-weight: bold;
    border: none;
}

/*　YouTube **********/

.Movie{
  margin: 16px auto 24px;
}

/*　タイトル */
#sp_page_topic #main .Movie__Title {
    color: #333;
    font-size: 13px;
    font-weight: bold;
    border: none;
    margin: 0;
    padding: 0 0 8px;
}

/*　動画 */
.Movie__Enclosure {
    position: static;
    width: 100%;
    max-width: 560px;
    height: auto;
}
.Movie__Iframe {
    position: static;
    width: auto;
    height: auto;
}


/* おすすめ製品 ****************************/

/*　おすすめ商品紹介 */
.ProductBox{
    width: auto;
    margin: 0;
}
.ProductBox:last-child {
    margin: 0;
}
.Product {
    width: 46%;
    margin: 0 2% 16px;
}
.Product:last-child {
    margin: 0 2%;
}

/*　商品画像 */
.Product__ImageLink{
    width: 100%;
    height: 92px;
    text-align: center;
}
.Product__Image{
    width: 92px;
    padding: 8px;
    box-sizing: border-box;
}

/*　商品名 */
.Product__Name{
    height: 32px;
    margin: 0 0 8px 0;
    font-size: 13px;
    font-weight: bold;
    text-decoration: underline;
    overflow: hidden;
}

/*　商品説明 */
.Product__Point{
    height: 48px;
    margin: 0 0 12px 0;
    overflow: hidden;
}

/* 価格 */
.Product__TaxIncludedPrice {
    color: #df0011;
}

/* もっと見る */
.MoreProduct{
    padding: 0 16px;
}
.MoreProduct__Button{
    display: inline-block;
    width: 100%;
    max-width: 384px;
    padding: 16px 0;
    height: auto;
}


/* お困りごと別に選ぶ ****************************/

.TroubleIntroduction{
    margin: 0 0 20px;
}
.TroubleBox{
    margin: 0;
}

/* お困りごと　各 **********/

.Trouble{
    width: 46%;
    max-width: 250px;
    margin: 4px 2% 16px;
}
.Trouble:nth-child(3n){
    margin: 4px 2% 16px;
}
.Trouble:nth-child(n+4){
    margin: 4px 2% 16px;
  }

/* リンク */
.Trouble__Link {
    padding: 12px;
}

/* お困りごと（グレー背景） */
.Trouble__Question{
    height: 48px;
    margin: -12px -12px 32px;
    padding: 8px;
    font-size: 13px;
    text-align: left;
}

/* 解決のおすすめ性能 */
.Trouble__Anser{
    min-height: auto;
    padding: 56px 0 0;
    margin: 0 0 12px;
    font-size: 15px;
    text-align: center;
    background-position: center 0;
}

/* 「商品一覧を見る」ボタン */
.Trouble__Button{
    width: 100%;
    padding: 0 4px;
}


/* Topic ****************************/

.Topic{
    width: auto;
    padding: 24px 12px;
}
/* タイトル */
#sp_page_topic #main .Topic__Title {
    padding: 0;
    margin: 0 0 24px;
    color: #005898;
    font-size: 15px;
    font-weight: bold;
    border: none;
    background: no-repeat;
}
.Topic__Icon{
    display: block;
    width: 64px;
    margin: 0 0 8px;
    line-height: 1;
}

/* Topic内コンテンツ　各 */
.TopicContents{
    margin: 0 0 32px;
}
.TopicContents:last-child{
    margin: 0;
}

/* Topic内 タイトル */
#sp_page_topic #main .TopicContents__Title {
    padding: 0;
    margin: 0 0 16px;
    color: #333;
    font-size: 13px;
    border: none;
    background: no-repeat;
}

/* 見直してみませんか？　**********/

/* 画像 */
.TopicContents__Image{
    width: 100%;
    max-width: 400px;
    height: auto;
    padding: 16px;
    margin: 16px auto 0;
}


/* Topic商品紹介　**********/

.ProductBox--Topic{
    margin: 0;
}
.Product--Topic{
    width: 46%;
    margin: 0 2% 16px;
}
.Product--Topic:last-child {
    margin: 0 3%;
}
.Product__ImageLink--Topic{
    width: 100%;
}


/*　製品を選ぶ 　**********************************/

.ChoiceBox{
    float: none;
    width: auto;
    padding: 0;
    margin: 0 12px;
    border: none;
}

/* 「製品を選ぶ」 */
#sp_page_topic #main .ChoiceBox__Title {
    display: block;
    padding: 12px;
    margin: 0;
    font-size: 15px;
    color: #333333;
    background-color: #fafafa;
    border-top: #b3b3b3 4px solid;
    border-bottom: #b3b3b3 1px solid;
    border-radius: 0;
}

/* 「～から選ぶ」　**********/

.ChoiceBox__Bundle{
    padding: 0;
    margin: 0;
}

/* タイトル */
#sp_page_topic #main .ChoiceTitle {
    padding: 16px 8px;
    margin: 0;
    font-size: 13px;
    font-weight: normal;
    line-height: 1;
    border: none;
}
/* タイトル　前のアイコン */
.ChoiceTitle__Icon{
    display: inline-block;
    margin: 0 4px 0 0;
}

/*　選択肢一覧 */
.ChoiceList{
    display: none;
    width: 100%;
    margin: 0;
}
.ChoiceList--Last{
    border-bottom:none;
}
#sp_page_topic #main .ChoiceList--Active {
    color: #005898;
    font-weight: bold;
}

/*　選択肢各種 */
.ChoiceList__Item{
    display: inline-block;
    width: 100%;
    padding: 0;
    margin: 0;
    text-indent: 0;
    border-top: #707070 dotted 1px;
}
.ChoiceList__Link {
    display: block;
    padding: 16px 8px 16px 16px;
    margin: 0;
}
.ChoiceList__Link:visited {
    color: #333;
}

/*　選択肢各種 後ろのアイコン（SPのみ） */
.ChoiceList__SpRight {
    display: block;
    float: right;
}

}


/*////////////////////////////// for SP (max-width:320px) //////////////////////////////*/
@media screen and (max-width: 320px){

/*　導入部分****************************/

/*　イントロダクション　テキスト */
.LeadSentence__Main {
    margin: 0 0 32px 0;
    font-size: 15px;
}


/* お困りごと別に選ぶ ****************************/

/* お困りごと　各 **********/

/* リンク */
.Trouble__Link {
    padding: 8px;
}

/* お困りごと（グレー背景） */
.Trouble__Question {
    height: 64px;
}

/* 解決のおすすめ性能 */
.Trouble__Anser {
    font-size: 13px;
}
.Trouble__Anser:after {
    font-size: 11px;
}

/* 「商品一覧を見る」ボタン */
.Trouble__Button {
    font-size: 12px;
}

}
