@charset "utf-8";
/*全体*/
.okd_opal{
    font-family: 'Noto Sans JP', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', '游ゴシック', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-weight: 400;
    letter-spacing: 0.08em;
    width: 100%;
    line-height: 1.6em;
    font-size: 15px;
    color:#5b5855;
    background-color: #ffffff;
}  
.okd_opal a{
    color :#5b5855;
    display: block;
}  

.okd_opal span{
    display: inline-block;
}

/*メインバナー*/
.opal_main{
    background-image: url("/img/usr/handicraft/event/opal2021/opal-main.jpg");
    background-color: rgba(255,255,255,0.1);
    background-blend-mode: lighten;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 400px;
    margin: 0 auto;
}
.opal_main_subtit{
    text-align: right;
    padding:40px 30px 20px 0;
    font-size: 1.1em;
    font-weight: 400;
    text-shadow: 1px 1px 1px #ffffff;
    letter-spacing: 0.25em;
    }
.opal_main_logo{
    display: flex;
    justify-content:flex-end;
	flex-wrap: wrap;
	align-items: stretch;
    }
.opal_main_logo_opal img{
    display: block;
    width: 180px;
    margin: 10px 50px 0 0;
    }
.opal_main_logo_kfs img{
    display: block;
    width: 170px;
    margin: 10px 50px 0 0;
    }
/*ロゴフェード*/
.fade{
  animation: fadeIn 4s 1 forwards;
}
    @keyframes fadeIn { 
        0% {
       opacity: 0;
       } 
        100%{
       opacity: 0.8;      
      }
    }
/*PC＿ナビ*/
.opal_navi .contents_wrapper .opalNaviList{
    display: flex;
    justify-content: center;
	flex-wrap: wrap;
	align-items: stretch; 
    margin-top: 10px;
}
.opal_navi_tit{
    font-size: 1.8em;
    font-weight: 700;
    text-align: center;
    line-height: 2em;
    margin: 30px auto 10px;
}
.opal_navi .contents_wrapper{
    width: 100%;
    max-width: 800px;
    margin: 0 auto 40px;
}
/*メニューボタン*/
.opalNaviList li{
    display: block;
    width: 200px;
    height: 54px;
    text-align: center;
    line-height: 54px;
    outline: none;
    margin: 10px 20px;
    font-weight: 700;
}
.opalNaviList li::before,
.opalNaviList li::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: '';
}
.opalNaviList li,
.opalNaviList li::before,
.opalNaviList li::after {
    box-sizing: border-box;
    transition: all .3s;
}
.opalNaviList li{
    position: relative;
    z-index: 2;
    background-color: #fff;
    border: 1px dotted #B9AFA1;
    border-left: solid 2px #B9AFA1;
    color: #B9AFA1;
    line-height: 50px;
    overflow: hidden;
    font-weight: 600;
}
.opalNaviList li::after {
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
}
.opalNaviList li:hover::after {
    left: 0;
    background-color: #B9AFA1;
}
.opalNaviList li a:hover{
    color: #ffffff;
}

/*PC_フィックスナビ_*/
@media screen and (min-width:781px) {
    .opal_ft_navi{
        position: fixed;
        width: 160px;
        bottom:16%;
        right:0;
        padding:9px 0 0;
        border:2px solid #B9AFA1;
        border-right:none;
        background-color:#B9AFA1;
        z-index:999;
    }
    .opal_ft_navi_tit{
        text-align: center;
        padding-bottom: 10px;
        font-size: 1.1em;
        color: #ffffff;
        letter-spacing: 0.08em;
        font-weight: 700;
    }
    .opalft_NaviList li{
        width:100%;
        background-color:#fff;
        text-align: center;
        border-bottom:2px dotted #cccccc;
    }
    .opalft_NaviList li:last-child{
        width:100%;
        background-color:#fff;
        text-align: center;
        border-bottom:none;
   }
    .opalft_NaviList li a{
        display: block;
        padding:6px 2px;
        font-size:12px;
        text-decoration: none;
        color: #5b5855;
}
    .opalft_NaviList li a:hover{
        opacity:0.8;
    }
    .pc_none,.pc_none img,.opal_floating_sp{
        display: none;
    }
}
@media screen and (max-width:780px) {
    .opal_ft_navi{
        display: none;
        }
    }
/*セクション共通*/
.okd_opal section{
    width: 100%;
    margin: 0 auto;
    padding-bottom: 70px;
}
.opal_contents_titbox{
    text-align: center;
    margin-bottom: 70px;
}
.opal_contents_tit{
    padding-top: 8px;
    font-size: 1.3em;
    line-height: 1.2em;
    font-weight: 700;
    color: #ffffff;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.2);
    height: 110px;
    background-image:url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_be.png"); 
    background-size: 170px;
    background-position: top center;
    background-repeat: no-repeat;
}
.opal_contents_subtit{
    font-size: 1.5em;
    font-weight: 700;
    margin-bottom: 20px;
}
.opal_contents_txt{
    width: 80%;
    margin: 0 auto 40px;
}
.opal_btn01{
    width: 90%;
    margin: 40px auto 0;
    border: 1px dotted #B9AFA1;
    text-align: center;
    line-height: 3.6em;
    margin-top: auto;
}
.opal_btn02{
    width: 90%;
    margin: 30px auto 0;
    border: 1px dotted #B9AFA1;
    text-align: center;
    line-height: 3.6em;
    margin-top: auto;
}
.opal_btn03{
    width: 90%;
    margin: 30px auto 0;
    border: 1px dotted #B9AFA1;
    text-align: center;
    line-height: 3.6em;
    margin-top: auto;
}
.opal_btn01 a:hover,.opal_btn02 a:hover{
    color: #ffffff;
    background: #B9AFA1;
}
.opal_btn03 a:hover{
    color: #ffffff;
    background: #e8c5c5;
}

/*セクション_オパール毛糸の魅力_ポイント*/
.opal_feature_listbox{
    max-width:1000px;
    background: #ffffff;
    padding:30px 0;
    display: flex;
    justify-content: space-evenly;
	flex-wrap: wrap;
	align-items: stretch;
    margin: 70px auto 20px;
}
.opal_feature_item{
    width: 33.3%;
    padding: 20px 0;
    box-sizing: border-box;
}
.opal_feature_item_txt{
    width:80%;
    margin: 0 auto;
    color:#5b5855;
}
.opal_feature_item .opal_feature_item_title{
    text-align: center;
    text-indent: 1em;
    font-size: 1.2em;
    font-weight: 700;
    margin: 30px auto 20px;
}
.opal_feature_item:first-child,.opal_feature_item:nth-child(2){
    border-right:dotted 2px #A29B93;
}
.opal_feature_item_img img{
    display: block;
    width: 46%;
    margin: 0 auto;
    border-radius: 50%;
}
.title_01 .opal_feature_item_img img{
    background: #d4a5a5;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}
.title_02 .opal_feature_item_img img{
    background:#B9AFA1;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}
.title_03 .opal_feature_item_img img{
    background:#73A8BD;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}

.title_01 .opal_feature_item_no,.title_01 .opal_feature_item_title{
    color: #CB9B9B;
}
.title_02 .opal_feature_item_no,.title_02 .opal_feature_item_title{
    color: #B5ADA1;
}
.title_03 .opal_feature_item_no,.title_03 .opal_feature_item_title{
    color: #6496AA;
}
/*NO下のライン*/
.opal_feature_item_no::after{
	content: '';
	position: absolute;
	left: 50%;
	bottom: -30px;
	/*下線の上下位置調整*/
	display: inline-block;
	width: 40px;
	/*下線の幅*/
	height: 4px;
	/*下線の太さ*/
	transform: translate(-50%);
	/*位置調整*/
}.title_01 .opal_feature_item_no::after{
 	background-color: #CB9B9B; /*下線の色*/ 
}
.title_02 .opal_feature_item_no::after{
 	background-color: #B5ADA1; /*下線の色*/
}
.title_03 .opal_feature_item_no::after{
 	background-color: #6496AA; /*下線の色*/
}
.opal_feature_item_no{
    font-size: 3.8em;
    font-weight: 700;
    text-align: center;
    margin-top: -70px;
    margin-bottom: 70px;
    position: relative;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}


/*セクション_オパール毛糸の魅力_イメージ画像*/
.opal_feature{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
    background-repeat: repeat;
    margin: 0 auto;
}
.opal_feature .opal_contents_tit{
    background-image:url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_pk.png");
}
.opal_feature_imglistbox{
    max-width:1000px;
    margin: 0 auto;
}
.opal_feature_imglist{
    display: flex;
    justify-content:space-between;
	flex-wrap: wrap;
	align-items: stretch;
    background-image:url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
    background-repeat: repeat;
}
.opal_feature_img img{
    width: 100%;
}
.opal_feature_img{
    text-align: center;
    width: 33%;
    margin-bottom: 6px;
}

/*セクション_Opal毛糸とKFSアトリエとは？_opal*/
.opal_intro_listbox_opal{
    max-width: 860px;
    margin: 0 auto;
    position: relative;
}
.opal_intro_listbox_opallogo img{
    width: 240px;
    position: absolute;
    top: 50px;
    left: 20px;
}
.opal_intro_listbox_opalimg01 img{
    width: 478px;
    position: absolute; 
    top: 0;
    right: 0;}

.opal_intro_listbox_opalimg02 img{
    width: 395px;
    position: absolute;
    top: 280px;
    left: 0;
}
.opal_intro_listbox_opaltxt{
    width: 410px;
    position: absolute;
    top: 410px;
    right: 20px;
    font-weight: 700;
    line-height: 1.8em;
}
.opal_intro_listbox_opal_detail{
    margin: 750px auto 0;
    max-width:900px;
    padding: 20px 30px;
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_circlebg_pk.png");
    background-repeat: no-repeat;
    background-size: 120px;
}
.opal_intro_listbox_opal_title{
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.8em;
    border-bottom: dotted 2px #A29B93;
    margin-bottom: 20px;
}
.opal_intro_attention{
    font-size: 0.8em;
    color: #999999;
    padding-top: 16px;
}
/*セクション_Opal毛糸とKFSアトリエとは？_kfs*/
.opal_intro_listbox_kfs{
    max-width: 860px;
    margin: 70px auto 0;
    position: relative;
}
.opal_intro_listbox_kfslogo img{
    width: 240px;
    position: absolute;
    top: 50px;
    right: 30px;
}
.opal_intro_listbox_kfsimg01 img{
    width: 478px;
    position: absolute; 
    top: 0;
    left: 0;}

.opal_intro_listbox_kfsimg02 img{
    width: 395px;
    position: absolute;
    top: 280px;
    right: 0;
}
.opal_intro_listbox_kfstxt{
    width: 410px;
    position: absolute;
    top: 410px;
    left: 20px;
    font-weight: 700;
    line-height: 1.8em;
}

.opal_intro_listbox_kfs_detail{
    margin: 750px auto 0;
    max-width:900px;
    padding: 20px 30px;
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_circlebg_bl.png");
    background-repeat: no-repeat;
    background-size: 120px;
}
.opal_intro_listbox_kfs_title{
    font-size: 1.2em;
    font-weight: 700;
    line-height: 1.8em;
    border-bottom: dotted 2px #A29B93;
    margin-bottom: 20px;
}
    .opal_intro_listbox_kfs_txt{
        padding-bottom: 60px;
    }

/*セクション_本紹介_テキスト*/
.opal_book_info{
    width: 100%;
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltbe.png");
    background-repeat: repeat;
}
.opal_book_infobox_title{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_bg_be.png"),url("/img/usr/handicraft/event/opal2021/bg/opal_squarebg.png");
    background-size: 70px,30px;
    background-repeat: repeat-x,no-repeat;
    background-position: top center,top 70px center;
    height: 100px;
    text-align: center;
    color: #ffffff;
    font-weight: 700;
    font-size: 1.4em;
    padding-top: 20px;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.2);
}
.opal_book_title{
    text-align: center;
    font-size: 1.3em;
    font-weight: 700;
    margin: 10px auto 30px;
}
.opal_book_title span{
     background:linear-gradient(transparent 80%, #ffff66 80%);
}
.opal_book_txt{
    text-align: center;
    margin-bottom: 30px;
    padding:10px;
}

/*セクション_本紹介_イメージ画像*/
.opal_book_info_imgbox{
    max-width:1000px;
    margin: 0 auto;
}
.opal_book_info_imglist{
    overflow: hidden;
    margin-bottom: 50px;
}
.opal_book_info_img{
    text-align: center;
    width: 33.3%;
    float: left;
}
.opal_book_info_img:first-child {
    width: 66.6%;
    margin: 0 auto;
    float: left;
}
.opal_book_info_img img{
    width: 98%;
    vertical-align:baseline;
}
.opal_book_info_img:first-child img{
    width: 99%;
    vertical-align:top;
}

/*セクション_ピックアップ*/
.opal_pickup_box{
    max-width:1000px;
    margin: 0 auto;
}
.opal_pickup .opal_contents_tit{
    background-image:url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_pk.png"); 
}
.opal_pickup_contents_box{
    margin-top: 50px;
}
.opal_pickup_contents_title{
    text-align: center; 
}
.opal_pickup_title{
    font-size: 1.4em;
    font-weight: 700;
    display: inline-block;
    padding: 0 10px;
    background:linear-gradient(transparent 50%, #e8c5c5 50%);
    margin: 20px auto;
}
.opal_pickup_txt{
    margin: 0 auto 30px;
}
.opal_pickup_list{
    display: flex;
    justify-content:space-around;
    align-items: stretch;
    flex-wrap: wrap;
}
.opal_pickup_item_name{
    font-weight: 700;
    font-size: 1.1em;
    margin: 10px 0;
}
.opal_pickup_item_txt{
    width: 100%;
    font-size: 0.9em;
    margin-bottom: 30px;
}
.opal_pickup_listbox_3 .opal_pickup_item{
     width: 32%;
}
.opal_pickup_item{
    display: flex;
    flex-direction: column;
    width: 46%;
    margin-bottom: 30px;
}
.opal_pickup_item img{
    width: 100%;
}
/*セクション_糸ラインナップ*/
.opal_yarnlineup{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
    background-repeat: repeat;   
}
.opal_yarnlineup_box{
    width: 1000px;
    margin:  0 auto;
}
.opal_yarnlineup .opal_contents_tit{
    background-image:url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_pk.png"); 
}
.opal_yarnlineup_listbox{
    text-align: center;
}
.opal_yarnlineup_listtit{
    display: inline-block;
    font-size: 1.4em;
    font-weight: 700;
    background:linear-gradient(transparent 50%, #e8c5c5 50%);
    margin: 60px auto 40px;
    padding: 0 10px;
}
.opal_yarnlineup_categorylist{
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
}
.opal_yarnlineup_categoryitem{
    display: flex;
    flex-direction: column;
    width: 33.33%;
    margin-bottom: 40px;
}
.opal_yarnlineup_categoryitem_img img{
    width: 100%;
}
.opal_yarnlineup_categoryitem_name{
    font-weight: 700;
    font-size: 1.1em;
    margin: 10px auto;
}
.opal_yarnlineup_categoryitem_txt{
    width: 90%;
    margin: 0 auto 20px;
    font-size: 0.9em;
}
/*セクション_ KFSオリジナル*/
.opal_kfslineup_box{
    max-width: 1000px;
    margin: 0 auto;
}
.opal_kfslineup .opal_contents_tit{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_bl.png");
}
.opal_kfslineup_item_name{
    font-size: 1.1em;
    line-height: 2em;
    font-weight: 700;
    border-bottom: dotted 2px #A29B93;
    margin: 10px 0;
}
.opal_kfslineup_list{
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
}
.opal_kfslineup_item{
    display: flex;
    flex-direction: column;
    align-items: stretch;
	flex-wrap: wrap;
    width: 33.33%;
    margin-bottom: 60px;
}
.opal_kfslineup_item_name{
    width: 92%;
    margin: 10px auto;
}
.opal_kfslineup_item_txt{
    width: 92%;
    margin: 0 auto 30px;
}
.opal_kfslineup_item_img img{
    width: 96%;
}

/*セクション_一緒に使いたい商品*/
.opal_accessories{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltbe.png");
    background-repeat: repeat;
}
.opal_accessories_box{
    max-width: 1000px;
    margin: 0 auto;
}
.opal_accessoriesc_list{
    display: flex;
    justify-content:space-around;
    align-items: stretch;
    flex-wrap: wrap;
    margin-bottom: 70px; 
}
.opal_accessories_item{
    display: flex;
    flex-direction: column;
    width: 46%;
}
.opal_accessories_item_img img{
    width: 100%;
}
.opal_accessories_item_name{
    margin: 10px auto;
}
.opal_accessories_item_name{
    font-size: 1.1em;
    font-weight: 700;
    margin: 10px 0;
}
.opal_accessories_item_txt{
    margin-bottom: 20px;
}

/*セクション_動画*/
.opal_movie_box{
    max-width: 800px;
    margin: 0 auto;
}
.opal_movie_item_movie{
	position: relative;
	width:100%;
	padding-bottom:55.6%;
}
.opal_movie_item_movie iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
    margin-bottom: 50px;
}
.opal_movie_item{
    margin: 50px auto;
}
.opal_movie_item_tit{
    font-size: 1.1em;
    font-weight: 700;
    text-align: center;
    margin-bottom: 10px;
}

/*セクション_サンプル作品画像*/
.opal_knitting_box{
    width: 100%;
    padding-bottom: 30px;
}
.opal_knitting_list{
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: stretch;
}
.opal_knitting{
    background: url("/img/usr/handicraft/event/opal2021/bg/opal_yarnbg_01.png"),url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
    background-repeat: repeat;
    background-size: 200px;
}
.opal_knitting .opal_contents_tit{
    background-image: url("/img/usr/handicraft/event/opal2021/bg/opal_titlebg_pk.png");
}
.opal_knitting_item{
    width: 20%;
    margin: 40px 20px;
}
.opal_knitting_item img{
    width: 100%;
    border-radius:50%;
    margin-bottom: 40px;
}

/**************************
タブレット用（画面サイズ780px以下）
**************************/
@media screen and (max-width:780px) {
    .okd_opal{
        width: 100%;
    }
    .opal_main_logo_opal img{
        width: 160px;
        margin: 20px 20px 0 0;
    }
    .opal_main_logo_kfs img{
        width: 150px;
        margin: 10px 20px 0 0;
    }
    /*タブレット_メニュー*/
    .opal_navi .contents_wrapper{
        width: 100%;
    }
    .opal_navi_tit{
        font-size: 1.6em;
    }
    .opal_navi .opalNaviList li{
        width:27%;
    }
.opal_feature_listbox,.opal_feature_imglistbox{
    width: 100%;
    }
.opal_intro_listbox_opal,.opal_intro_listbox_kfs{
    width: 100%;
    }
.opal_intro_listbox_opal_detail,.opal_intro_listbox_kfs_detail{
     width: 100%;
     padding: 20px 0;
    }
.opal_book_info_imgbox{
    width: 96%;
    }
/*タブレット_セクション_Opal毛糸とKFSアトリエとは？_画像*/ 
    .opal_intro_listbox_opal,.opal_intro_listbox_kfs{
        width: 100%;
        display: flex;
        justify-content: center;
        flex-flow: column;
    }
    .opal_intro_listbox_opal,.opal_intro_listbox_opallogo img,.opal_intro_listbox_opalimg01 img,.opal_intro_listbox_opalimg02 img,.opal_intro_listbox_opaltxt{
        position: static;
        width: 96%;
        margin: 10px auto;
    }
    .opal_intro_listbox_kfs,.opal_intro_listbox_kfslogo img,.opal_intro_listbox_kfsimg01 img,.opal_intro_listbox_kfsimg02 img,.opal_intro_listbox_kfstxt{
        position: static;
        width: 96%;
        margin: 10px auto;
    }
    .opal_intro_listbox_opallogo,.opal_intro_listbox_kfslogo{
        width: 40%;
        margin: 30px auto;
        order: 1;
        border-bottom: dotted 2px #A29B93;
    }
    .opal_intro_listbox_opaltxt,.opal_intro_listbox_kfstxt{
        order: 2;
    }
    .opal_intro_listbox_opalimg01,.opal_intro_listbox_kfsimg01{
        order: 3;
    }
    .opal_intro_listbox_opalimg02,.opal_intro_listbox_kfsimg02{
        order: 4;
    }
    /*タブレット_セクション_Opal毛糸とKFSアトリエとは？_説明*/ 
    .opal_intro_listbox_opal_detail,.opal_intro_listbox_kfs_detail{
        width: 94%;
        margin-top: 10px;
        font-size: 0.9em;
        background-size: 90px;
        padding: 20px 0;
    }
    .opal_intro_listbox_opal_title,.opal_intro_listbox_kfs_title{
        margin-bottom: 6px;
    }
    .opal_intro_listbox_opalimg01 img,.opal_intro_listbox_opalimg02 img,.opal_intro_listbox_kfsimg01 img,.opal_intro_listbox_kfsimg02 img{
        display: block;
        width: 80%;
        margin: 10px auto 10px;
    }
    /*タブレット_セクション_糸ラインナップ*/
    .opal_yarnlineup_box{
        width: 100%;
    }
    /*タブレット_セクション_サンプル作品画像*/
    .opal_knitting_list{
        width: 96%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        align-items: stretch;
    }
    .opal_knitting{
        background: url("/img/usr/handicraft/event/opal2021/bg/opal_yarnbg_01.png"),url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
        background-repeat: repeat;
        background-size: 200px;
    }
    .opal_knitting_item{
        width: 29%;
        margin: 20px 1%;
    }
    .opal_knitting_item img{
        width: 100%;
        border-radius:50%;
        margin-bottom: 40px;
    }
}


/*SPタブレット用_ナビ*/
@media screen and (max-width:780px) { 
	.opal_floating_sp{
		display: none;
	}
	.opal_floating_sp div[class^="opalNavi_cont"]{
        width:48%;
		position:relative;
		top: auto;
		left: auto;
		text-align: center;
	}	
	div[class^="embroideryNavi_cont"] p{
		font-size: 1rem;
	}
	.opal_floating_sp div[class^="opalNavi_cont"] a p {
        width: 86%;
        height: 50px;
        line-height:48px;
        font-size:14px;
        margin: 0 auto;
        border: 1px solid #7e7e7e;
        border-radius: 5px;
}
	.opal_floating_sp div[class^="opalNavi_cont"] a p br{
		display: none;
	}
	
	.opal_floating_btn.fixed_sp {
		display: block;
		position: fixed;
		bottom: 20px;
		left: 5px;
		z-index: 56;
		text-align: center;
		font-weight: 700;
		font-size: 13px;
	}
	.opal_floating_sp.opalactive{
		display: flex !important;
        height: 100%;
        width: 100%;
        padding: 20% 0;
        position: fixed;
        flex-wrap: wrap;
        top: 0;
        left: 0;
        background-color: rgba(250,250,250,0.95);
        z-index: 1000;
        justify-content: flex-start;
	}
	.opal_floating_btn.fixed_sp img{
		width: 80px;
	}
	.opal_floating div[class^="opalNavi_cont"] img{
		display: none;
	}
    .opal_book_infobox_title{
        font-size: 1.3em;
        letter-spacing: 0;
    }
    .opal_book_title{
        font-size: 1.2em;
    }
    .opalNaviList .opalNaviList_neme:hover{
        color: #ffffff;
    }
    .opal_floating_close{
        width:250px;
        height: 100px;
        margin: 0 auto;
        color: #4f4744;
        text-align: center;
        padding:10px;
    }
}


/**************************
SP用（画面サイズ480px以下）
**************************/

@media screen and (max-width:480px) {
    .okd_opal{
        width: 100%;
    }
    /*SP_メインバナー*/
    .opal_main_box{
        background-image: url("/img/usr/handicraft/event/opal2021/opal-main.jpg");
        background-position: center;
        background-size: cover;
        width: 100%;
        height: 400px;
        margin: 0 auto;
    }
    .opal_main_subtit{
        padding: 30px 10px 0 20px;
        font-size: 1em;
        color: #5b5855;
    }
    .opal_main_logo{
        padding: 10px 0 0 20px;
        display: flex;
        justify-content:flex-end;
	    flex-wrap: wrap;
	    align-items: stretch;
        margin-right: 3%;
    }
    .opal_main_logo_opal img{
        width: 38%;
        margin: 20px 0 0 56%;
    }
    .opal_main_logo_kfs img{
        width: 35%;
        margin: 10px 0 0 59%;
    }
    /*SP_フェード*/
    .fade{
          animation: fadeIn 3s 1 forwards;
    }
   /*SP_メニュー*/
    .opal_navi .contents_wrapper{
        width: 100%;
    }
    .opal_navi_tit{
        font-size: 1.4em;
    }
    .opal_navi .opalNaviList li{
        width: 46%;
        font-size: 0.9em;
        margin: 8px 2%;
    }
    /*SP_セクション共通*/
    .okd_opal section{
        width: 100%;
        padding-bottom: 50px;
    }
    .opal_contents_titbox{
        margin-bottom: 50px;
    }
    .opal_contents_subtit{
        font-size: 1.3em;
    }
    .opal_contents_txt{
        width: 90%;
    }
    .opal_btn01,.opal_btn02,.opal_btn03{
        width: 90%;
    }
    /*SP_セクション_オパール毛糸の魅力_説明*/
    .opal_feature_item_img{
        width: 70%;
        margin: 0 auto;
    }
    .opal_feature_item_img img{
        width:70%;
    }

    /*SP_セクション_オパール毛糸の魅力_イメージ画像*/
    .opal_feature_listbox{
        width:100%;
        display: flex;
        justify-content:center;
        flex-flow: column;
    }
    .opal_feature_item{
        width: 94%;
        margin: 0 auto;
    }
    .opal_feature_item:first-child,.opal_feature_item:nth-child(2){
        border-right: none;
        border-bottom: dotted 2px #A29B93;
        padding-bottom: 30px;
        padding-right: 0px;
    }
    .opal_feature_imglistbox{
        width:98%;
        margin: 0 auto;
    } 
    .opal_feature_img{
        width:49%;
    }
    .opal_feature_item_no{
        margin-top: 20px;
    }
    .opal_feature_item_txt{
        width: 80%;
        margin: 0 auto;
        }
    /*SP_セクション_Opal毛糸とKFSアトリエとは？_画像*/  
    .opal_intro_listbox_opal,.opal_intro_listbox_kfs{
        width: 96%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        flex-flow: column;
    }
    .opal_intro_listbox_opal,.opal_intro_listbox_opallogo img,.opal_intro_listbox_opalimg01 img,.opal_intro_listbox_opalimg02 img,.opal_intro_listbox_opaltxt{
        position: static;
        width: 98%;
        margin-bottom: 10px;
    }
    .opal_intro_listbox_kfs,.opal_intro_listbox_kfslogo img,.opal_intro_listbox_kfsimg01 img,.opal_intro_listbox_kfsimg02 img,.opal_intro_listbox_kfstxt{
        position: static;
        width: 98%;
        margin-bottom: 10px;
    }
    .opal_intro_listbox_opallogo,.opal_intro_listbox_kfslogo{
        width: 40%;
        margin: 20px auto;
        order: 1;
        border-bottom: dotted 2px #A29B93;
    }
    .opal_intro_listbox_opaltxt,.opal_intro_listbox_kfstxt{
        margin-bottom: 10px;
        order: 2;
    }
    .opal_intro_listbox_opalimg01,.opal_intro_listbox_kfsimg01{
        order: 3;
    }
    .opal_intro_listbox_opalimg02,.opal_intro_listbox_kfsimg02{
        order: 4;
    }

    /*SP_セクション_Opal毛糸とKFSアトリエとは？_説明*/ 
    .opal_intro_listbox_opal_detail,.opal_intro_listbox_kfs_detail{
        margin: 10px auto;
        padding: 20px 0;
        font-size: 0.9em;
        background-size: 90px;
    }
    .opal_intro_listbox_opal_title,.opal_intro_listbox_kfs_title{
        margin-bottom: 6px;
    }

    /*SP_セクション_本紹介_テキスト*/ 
    .opal_book_infobox_title{
        font-size: 1.1em;
        padding-top: 9px;
        letter-spacing: 0em;
    }
    .opal_book_title{
        margin: 0 auto 20px;
        font-size: 1.2em;
    }
    /*SP_セクション_本紹介_イメージ画像*/
    .opal_book_info_imgbox{
        width: 100%;
    }
    .opal_book_info_imglist{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding: 1%;
    }
    .opal_book_info_img{
        width: 48%;
        float: none;
        margin-bottom: 2px;
    }
    .opal_book_info_img:first-child {
    width: 97%;
    margin: 0 auto 8px;
    }
    .opal_book_info_img:nth-child(4){
    width: 97%;
    margin: 0 auto;
    }
    /*SP_セクション_ピックアップ*/
    .opal_pickup_box{
    width: 100%;
    padding: 1px;
   }
    .opal_pickup_txt{
        padding: 0 2%;
    }
    .opal_pickup_item{
        width:90%;
        margin: 0 auto 50px;
    }
    .opal_pickup_listbox_3 .opal_pickup_item{
         width: 90%;
    } 
    /*SP_セクション_糸ラインナップ*/
    .opal_yarnlineup_categorylist{
        margin-bottom: 0px;
    }
    .opal_yarnlineup_categoryitem{
        width:50%;
    }  
    /*セクション_ KFSオリジナル*/
    .opal_kfslineup_box{
        width: 100%;
        padding: 0 1px;
    }    
    .opal_kfslineup_item{
        width: 90%;
    }
    .opal_kfslineup_list{
        margin-bottom: 0;
    }  
    /*セクション_糸ラインナップ*/ 
    .opal_accessories_box{
        width: 100%;
    }
    .opal_accessories_item{
        width:90%;
        margin: 0 auto 40px;
    }
    .opal_accessoriesc_list{
        display: flex;
        justify-content: center;
        flex-flow: column;
        padding: 1%;
    }
    /*SP_セクション_動画  */  
    .opal_movie_box{
        width: 100%;
    }
    .opal_contents_titbox{
        width: 100%;
    }
    .opal_movie_list{
        width: 100%;
    }
    /*SP_セクション_サンプル作品画像*/
    .opal_knitting_list{
        width: 96%;
    }
    .opal_knitting{
        background: url("/img/usr/handicraft/event/opal2021/bg/opal_yarnbg_01.png"),url("/img/usr/handicraft/event/opal2021/bg/opal_bg_ltpk.png");
        background-repeat: repeat;
        background-size: 150px;
    }
    .opal_knitting_item{
        width: 45%;
        margin: 4px 2%;
    }
}/*//SP用*/