/*=============================================================*/
/*display: flexを使うときは、IE9以降に対応させるためのポリフィルを併用する。*/

/*display: flex;*/
/*-js-display: flex;!*ポリフィル*!*/

/*================================================================*/
body{
    font-size: 16px;/*ベースフォントサイズ*/
}
/*-------------------------------------------フォントサイズ*/
main p {
    font-size: 1em; /* 16px */
    line-height: 1.5000em; /* 24px */
    margin: 0 0 1.5000em 0;
    font-weight: 400;
}

main li{
    font-weight: 400;
}

/*----------------------------------------ページタイトル*/

.Title-hedding_wrap{
    width: 100%;
}

#Title-hedding {
    max-width: 1380px;
    padding: 0 40px;
    box-sizing: border-box;
    margin: 100px auto 50px auto;
}

#Title-hedding .title_block{
    position: relative;
    margin-bottom: 40px;
}

#Title-hedding .title_block h1{
    font-size: 3em;
    line-height: 1.1em;
    font-weight: 900;
    position:relative;
    z-index: 10;
    top: 30px;
    padding-top: 1.2em;
}

#Title-hedding .title_block h3{
    font-family: 'Teko', sans-serif;
    font-size: 2em;
    position: absolute;
    color: #ddd;
    top: 0;
    left: 5px;
}

#Title-hedding .title_block h2{
    font-family: 'Teko', sans-serif;
    font-size: 8em;
    color:#ddd;
    position: absolute;
    top: 0;
}

#Title-hedding p.lead {
    font-size: 1.1250em; /* 22px */
    line-height: 1.5;
    /*margin-top: em;*/
    margin-bottom: 0.0000em;
}


/*---------------------------ローカルナビゲーション*/
.sub_navi{
    display: flex;
    justify-content:flex-end;
    box-sizing: border-box;
    margin:  0 auto;
}

.sub_navi li{
    background: #ddd;
    margin-left:1px;
}

.sub_navi li a{
    display: block;
    padding:15px 20px ;
}
.subnab_wrap{
    margin-top: 100px;
    width: 100%;
}

.sub_navi a.active{
    background: #333;
    color: #fff;
}

/*----------------------------------------------------main*/
main{
    margin: 0 auto;
    display: block;/*IE用*/
    box-sizing: border-box;
    background:transparent !important;
    padding: 0!important;
}

main img{
    width: 100%;
    height: auto;
}

/*---------------------------レイアウト*/

#Container{
    box-sizing: border-box;
    /*padding: 35px 0 0 0;*/
}

.wrap_01{
    background: #ffffff;
}

.wrap_02{
}

.wrap_03{
    background: #e6e9ea;
}

.section_wrapper{
    max-width:1380px;
    padding: 70px 40px 80px 40px;
    margin: 0 auto;
    box-sizing: border-box;
}

.section_wrapper_col{
    margin-bottom: 80px;
}

.section_wrapper_col:last-child{
    margin-bottom: 0;
}

/* display */
.pc-only {
    display: block;
}

.sp-only {
    display: none;
}

/*---------------------------------------------SNSボタン*/

/*youtubeのボタン高さ調整*/
/*.youtube{*/
    /*border-radius: 3px !important;*/
    /*height: 20px !important;*/
    /*overflow: hidden !important;*/
/*}*/

/*.yt-uix-button-subscription-container {*/
    /*display: block;*/
    /*margin-left: -1px !important;*/
    /*margin-top: -2px !important;*/
/*}*/


/*facebook Twitter youtube*/
#Header{
    display: flex;
    justify-content: flex-end;
}

.facebook{
    order: 2;
    width: 110px !important;
    overflow: hidden !important;
}

.tweet{
    order: 1;
    margin-right: 5px;
}

.youtube{
    order: 3;
}

.sns-waku{
    background: #e6e9ea;
    padding:20px 0;
}
.sns-waku a:link{
    text-decoration: none;
}


.sns-icons{
    font-size: 200%;
    color: #333;
    display: flex;
    -js-display: flex;
    justify-content: center;
}

.sns-icons li{
    margin-left: 20px;
}

.sns-icons a:hover{
    color: #efea3a;
}

/*------------------------------------------------h2 見出し*/

/*英語+日本語*/
/*.section_wrapper_col > h2,*/
/*.section_wrapper_col > div h2,*/
/*.function_contents_wrap h2{*/
    /*margin-top: 0;*/
    /*margin-bottom: 35px;*/
    /*!*border-bottom: 1px solid #333;*!*/
    /*display: flex;*/
    /*flex-direction: column;*/

/*}*/


.section_wrapper_col h2{
    margin-bottom: 30px;
}



.section_wrapper_col h2 em,
.function_contents_wrap h2 em{
    font-size: 2.4em;
    font-weight: 800;
    line-height: 1.2;

}

.section_wrapper_col h2 span,
.function_contents_wrap h2 span{
    display: block;
    font-family: "Teko",sans-serif;
    color: #999;
    font-size: 2em;
    letter-spacing: 0.1em;
}

main h3{
    font-size: 1.3750em; /* 22px */
    line-height: 1.5; /* 24px */
    margin-top: 0;
    margin-bottom: 1.0909em;

}

/*------------------------------カラー (色)*/

.debut_color{
    background: #a9d12d !important;
}

.pro_color{
    background:#7dcdd8 !important;;
}

.ex_color{
    /*background: #78aae5;*/
    background:#498ecc !important;
}

/*------------------------------カラー (テキスト色)*/

.caution_color{
    color:#ce2323 !important;
}

/*------------------------------動画(youtubeサイズ調整用)*/

/*youtube*/
.movie_youtube{
    position: relative;
    padding-bottom: 56.25%;

    height: 0;
    overflow: hidden;



}
.movie_youtube iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90%;

}

/*------------------------------------------------リンク*/

main a{
    color: #666;
    transition: 0.3s ease 0s;
   text-decoration: underline;
}

main a:hover{
    opacity: 0.5;
}

/*矢印つき*/
.mark li::before{
    content: "\f105";
    font-family: FontAwesome;
}
.mark li{
    margin-bottom: 5px;
}

/*外部リンク*/
/*section a[href^="http:"]{*/
/*color:#666;*/

/*}*/
/*section a[href^="http:"] *::before{*/
/*font-family: FontAwesome;*/
/*content : "\f0c1";*/
/*color:#666;*/
/*padding-left:5px;*/

/*}*/


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

.anchor{
    margin-bottom: 100px;
}

.anchor ul {
    display: flex;
    -js-display: flex;/*ポリフィル*/
    flex-wrap: wrap;

}
.anchor ul li{
    border:solid 1px #ccc;
    margin-right:-1px;
    margin-top:-1px
}

.anchor ul a{
    background: #ffffff;
    display: block;
    padding: 10px;
    font-size: 80%;
    text-decoration:none;
    font-weight: bold;
	color: #666;
}

.anchor ul a::before{
    content: "\f0d7";
    font-family: FontAwesome;
    padding-right: 5px;
    color: #cccccc;
}

.anchor ul a:hover{
    background: #eee;
}

.anchor2{
    margin-bottom: 80px;
}

.anchor2 ul {
    display: flex;
    -js-display: flex;/*ポリフィル*/
    flex-wrap: wrap;

}
.anchor2 ul li{
    border:solid 1px #ccc;
    margin-right:-1px;
    margin-top:-1px
}

.anchor2 ul a{
    background: #ffffff;
    display: block;
    padding: 10px;
    font-size: 80%;
    text-decoration:none;
    font-weight: bold;
    width:250px;
}

.anchor2 ul a::before{
    content: "\f0d7";
    font-family: FontAwesome;
    padding-right: 5px;
    color: #cccccc;
}

.anchor2 ul a:hover{
    background: #eee;
}
/*----------------------------------------ボタン　基本スタイル*/
/*購入、トライアルボタンはcommon_ja.cssに----------------------*/

/*黒ボタン*/
.other_btn{
    text-align:center;
}

.other_btn a{
    font-size:90%;
    text-align: center;
    box-sizing: border-box;
    display: block;
    background: #333;
    border: 1px solid #292929;
    border-bottom: 1px solid #131313;
    border-radius: 3px;
    color: #fff;
    text-decoration: none;
}

.other_btn a:hover{
    background: #404040;
}

/*黒ボタン:::幅100%*/
.other_btn_01{
    text-align: center;
}
.other_btn_01 a{
    font-size:90%;
    text-align: center;
    box-sizing: border-box;
    display: block;
    background: #333;
    border: 1px solid #292929;
    border-bottom: 1px solid #131313;
    border-radius: 3px;
    color: #fff;
    width:100%;
    padding: 15px;
    text-decoration: none;

}
.other_btn_01 a:hover{
    background: #404040;
}

/*黒ボタン:幅あり+youtube*/
.other_btn_02{

    justify-content: space-between;
    align-items: center;
    background: #333;
    width: auto;
    text-decoration: none;
    color: #fff;
    border-radius: 3px;
    padding: 15px;
}

/*黒ボタン:::幅あり   */
.other_btn_03{
    text-align: center;
}

.other_btn_03 li{
    width: auto;
}

.other_btn_03 a{
    font-size:90%;
    text-align: center;
    box-sizing: border-box;
    display: block;
    background: #333;
    border: 1px solid #292929;
    border-bottom: 1px solid #131313;
    border-radius: 3px;
    color: #fff;
    width:20em;
    padding: 15px;
    text-decoration: none;
}
.other_btn_03 a:hover{
    background: #404040;
}

/*黒ボタン:::幅 auto +中央寄せ */
.other_btn_04{

    display: flex;
    justify-content: center;
}

.other_btn_04 li{
    width: auto;
}

.other_btn_04 a{
    font-size:90%;
    text-align: center;
    box-sizing: border-box;
    display: block;
    background: #333;
    border: 1px solid #292929;
    border-bottom: 1px solid #131313;
    border-radius: 3px;
    color: #fff;
    width: auto;
    padding: 15px;
    text-decoration: none;
}

.other_btn_04 a:hover{
    background: #404040;
}


/*-------------------------------------------テキストの寄せ*/

/*中央*/
.text-align{
    text-align: center !important;
}

/*右*/
.text-right,
.right_align{
    text-align: right;
}

/*-------------------------------------------テーブル・表*/

/*セルの色を白にする*/
.non_color{
    background: #fff !important;
}

/*simple_line*/
.simple_line{
    width: auto;
    border-collapse: collapse;
    font-size: 90%;
}

.simple_line thead th{
    background: #333333;
    color: #ffffff;
    border-bottom: 1px solid #666;
}

.simple_line th,
.simple_line td{
    border: 1px solid #666;
    padding: 8px 15px;
}
.simple_line td{
    font-weight: 300;
}
.simple_line tbody th{
    background: #f3f6f7;
    text-align: left;
}


/*type2 : theadのthの背景が薄いブルー*/
table.type02{
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border: 1px solid #ccc;
    width: auto;
    font-size: 90%;
    margin-bottom: 10px;
    background: #ffffff;
}
table.type02 th,
table.type02 td{
    border: 1px solid #666;
    padding: 8px;
}
table.type02 th{
    font-weight: bold;
    vertical-align: top;
}

table.type02 thead th {
    color: #fff;
    background: #333;
}

table.type02 tbody th{
    background:#f3f6f7;
}

table.type02 .pro_color,
table.type02 .ex_color,
table.type02 .debut_color{
    width:10em;
}

table.type02 .pro_color.min,
table.type02 .ex_color.min,
table.type02 .debut_color.min{
    width:5em !important;
}

table.type02 td.kome_cell{
    position:relative;
}
table.type02 .kome_sup{
    position:absolute;
    font-size:60%;
}

/*type3 : セルを交互に色つけ*/
table.type04{
    background: #ffffff;
    margin-bottom: 10px;
}

table.type04 th{
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border: 1px solid #ccc;
    width: auto;
    font-size: 90%;
    margin-bottom: 10px;

}

table.type04 th,
table.type04 td{
    border: 1px solid #666;
    padding: 8px;
}


table.type04 tr:nth-child(even) td {
background: #f3f6f7;
}

table.type04 thead th{
    background: #333333;
    color: #ffffff;
}

table.type04 tbody th{
    background: #637e90;
    color: #fff;
}

table.type04 .pro_color,
table.type04 .ex_color,
table.type04 .debut_color{
    width:10em;
}

table.type04 .pro_color.min,
table.type04 .ex_color.min,
table.type04 .debut_color.min{
    width:5em !important;
}

/*hdead thが薄い黄色*/
table.type05{
    width: auto;
    border-collapse: collapse;
    margin-bottom: 20px;
}

table.type05 thead th{
    background: #fcfbe8;
    color: #333;
    border-bottom: 1px solid #666;
    padding:20px;
}

table.type05 th,
table.type05 td{
    border: 1px solid #666;
    padding: 8px 15px;
    font-weight: bold;
}

table.type05 td{
    padding:5px !important;
}

/*-------------------------------------------注意喚起*/

/*文字サイズ：90%*/
.note01{
    color: #666666;
    font-size: 90%;
    line-height: 1.5;
    font-weight: 300;
}

.note01 li{
    margin-bottom: 5px;
}

/*文字サイズ：100％*/
.note02{
    color: #666666;
    line-height: 1.5;
    font-weight: 300;
   }

.note02 li{
    margin-bottom: 5px;
}

/*文字サイズ：100％ +　太字*/
.note03{
    font-size: 100%;
    line-height: 1.5;
    font-weight: bold;
}

.note03 li{
    margin-bottom: 5px;
}


/*02　枠囲み*/
.note_box02{
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 10px ;
}

.note_box02 h4 + *:last-of-type{
    margin-bottom: 0 !important;
}
.note_box02 h4{
    margin-top:0 !important;
    margin-bottom:10px !important;
    font-weight: bold;
}

.note_box02 > *{
    font-weight: 300;
}

.note_box02 > *:last-of-type{
    margin-bottom: 0;
}

/*枠囲み：:タイトル横並び*/
.note_box01{
    border: 3px solid #eee;
    padding: 15px;
    border-radius: 5px;
    display: flex;
    -js-display: flex;
    margin-bottom: 30px;
}

.note_box01 h4{
    /*background: #efea3a;*/
    display: inline-block;
    padding: 0 0.5em;
    font-size: 90%;
    margin-right: 1em;
    align-self: center;
    font-weight: bold;
    white-space: nowrap;
}

.note_box01 > div{
    border-left:1px dotted #ccc;
    padding-left: 1em;
}

/*枠囲み：:タイトル横並び:枠の色が濃い目*/
.note_box04{
    border: 3px solid #ccc;
    padding: 15px;
    border-radius: 5px;
    display: flex;
    -js-display: flex;
    margin-bottom: 30px;
}

.note_box04 h4{
    /*background: #efea3a;*/
    display: inline-block;
    padding: 0 0.5em;
    font-size: 90%;
    margin-right: 1em;
    align-self: center;
    font-weight: bold;
    white-space: nowrap;
}

.note_box04 > div{
    border-left:1px dotted #ccc;
    padding-left: 1em;
}

/*枠囲み:::背景塗り*/
.note_box03{
    /*border: 3px solid #eee;*/
    /*background: #eeeeee;*/
    background: #fafbe5;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 10px;
}

.note_box03 *{
    font-weight: 300;
}

.note_box03 h4 + *:last-of-type{
    margin-bottom: 0 !important;
}

.note_box03 h4{
    margin-top:0 !important;
    margin-bottom:10px !important;
    color:#333;
    font-weight: bold;
}



/*-----------------------------------------------リスト*/

/*マーカーつき*/
.list-mark{
    margin-bottom: 20px;
}
.list-mark li {
    display: flex;
    /*align-items: center;*/
    padding-left:1em;
    margin-bottom: 5px;
}

span.list-mark {
    display: flex;
    /*align-items: center;*/
    padding-left:1em;
    margin-bottom: 0px;
}

.list-mark li::before{
    content: "\f10c";
    font-family: FontAwesome;
    color: #999;
    padding-right: 3px;
    margin-left:-1em;
}



/*-----------------------------------------ラインナップ・関連商品
購入エリア
------------------------------------*/

.itemBox02{
    margin-bottom: 40px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 30px;
    display: flex;
    /*-js-display: flex;!*ポリフィル*!*/
    justify-content: space-between;
}
.itemBox02:last-child{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;;
}
.itemBox02.colum{/*flesx*/
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    display: block;
}

.itemBox02:last-child{
    border: none;
}
.itemBox02 h2{
    font-size: 1.8em;
    margin-bottom: 20px;
    line-height: 1.3;
    font-weight: 800;

}

.itemBox02 h2 span{
    display: block;
    font-weight:normal;
    font-size:60%;
    color:#999;
    font-family: "Lato","Noto Sans JP",sans-serif !important;

}

.itemBox02 h3.ex {
    background: #498ecc none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 70%;
    padding: 0 10px;
    margin-bottom: 8px;
}

.itemBox02 h3.pro {
    background: #7dcdd8 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 70%;
    padding: 0 5px;
    margin-bottom: 8px;
}

.itemBox02 h3.debut {
    background: #a9d12d none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 70%;
    padding: 0 5px;
    margin-bottom: 8px;
}

.itemBox02-innter_col01{
    flex-basis: 25%;
    margin-right: 20px;
}

.itemBox02-innter_col01 .lineup_pk{
    border: 1px solid #ccc;
    align-items: center;
    text-align: center;
    padding: 20px;
}

.itemBox02-innter_col01 h3{
    font-size: 80%;
    font-weight: normal;
    margin-top: 20px;
}


.itemBox02-innter_col01 h4{
    margin:30px 0 5px 0;
    font-weight: 600;
}

.itemBox02-innter_col01 .spec{
    border-top:1px solid #333;
}
.itemBox02-innter_col01 .spec li{
    border-bottom:1px solid #ccc;
    padding: 5px 0;
}

.itemBox02-innter_col01 .spec li:last-child{
    border-bottom:1px solid #333;
}

.itemBox02-innter_col02{
    flex-basis: 70%;
    /*margin-right: 20px;*/
}

.itemBox02-innter_col02 .image_set_box{
    display: flex;
    -js-display: flex;/*ポリフィル*/
    flex-wrap: wrap;
    justify-content: space-between;
}
.itemBox02-innter_col02 .image_set_box a{
    flex-basis: 49%;
    display: block;
    margin-bottom: 15px;
}

.itemBox02-innter_col02 .image_set_box img{
    width: 100%;
}
.itemBox02-innter_col02 h3{
    font-size: 100%;
    font-weight: 600;
    margin-bottom: 10px;
}

.itemBox02-innter_col02 .right_block{
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.itemBox02-innter_col02 h4{
    /*border-bottom: solid 3px #333;*/
    margin:30px 0 5px 0;
    font-weight: 600;
}

.itemBox02-innter_col02 .youtube{
    margin-top: 20px;
}

.itemBox02-innter_col02 table.lineup_buy{
    border-top: solid 2px #333;
    border-bottom: solid 2px #333;
    /*background: #ffffff;*/
    /*padding: 0 15px 5px 15px  ;*/
    margin-bottom: 10px;
    width: 100%;
    font-size: 90%;
}

.itemBox02-innter_col02 table.lineup_buy th{
    text-align: left;
    padding: 5px ;
}

.itemBox02-innter_col02 table.lineup_buy th.wid20{
    width:20%;
}

.itemBox02-innter_col02 table.lineup_buy th.pad_top_btm{
    padding:15px 5px;
}

.itemBox02-innter_col02 table.lineup_buy td{
    padding: 5px ;
}

.itemBox02-innter_col02 table.lineup_buy td.pc_none{
    display:none;
}

.itemBox02-innter_col02 table.lineup_buy tr{
    border-bottom: solid 1px #ddd;
}

.itemBox02-innter_col02 table.lineup_buy tr:last-child{
    border: none;
}

.itemBox02-innter_col02 .buy_btn a{
    padding: 10px ;
}

.itemBox02-innter_col02 .other_btn a{
    padding: 10px ;
}

.itemBox02-innter_col02 .price em{
    font-size: 130%;
    font-weight: 600;
}

.itemBox02-innter_col02 .btn_wrap{
    width: 30%;
}

.itemBox02-innter_col02 table th{
    text-align: left;
    padding: 10px 0;
}

.itemBox02-innter_col02 table td{
    padding: 10px 0;
}

.itemBox02-innter_col02 table tr{
    border-bottom: solid 1px #ccc;
}

.itemBox02-innter_col02 table tr:last-child{
    border: none;
}

.itemBox02-innter_col02 .price{
    font-weight: normal;
    font-size: 100%;
    line-height: 1.2;
    margin-bottom: 10px;
    color: #333333;
}



/*------------------------------------ギャラリー
----------------------------------------------*/

.gallery_title {
    display:flex;
    justify-content:space-between;
}

.gallery_title .title_block_wrap{
    flex-basis: 80%;
}

.gallery_title .lead-col02 {
    flex-basis: 10%;
    margin-top: 30px;
}

.gallery_title .lead-col02 img{
    width: 100%;
}

.gallery_list{
    margin-right: -1.4%;
}

.gallery_list > div{
    display: inline-block;
    width: 200px;
    margin-bottom: 60px;
    margin-right: 1.15%;
    box-sizing: border-box;
}

.gallery_list > div a{
    display: block;
}

.gallery_list > div > ul{
    display: flex;
    flex-direction: column;
    padding: 10px 0 5px 0;
    /*border-left: 1px solid #ccc;*/
}

.gallery_lisst > div >ul li:first-child{/*作者名*/
    order:2;
    font-size: 80%;
    color: #666666;
    }

.gallery_list > div >ul li:last-child{/*作品名*/
    order: 1;
    font-size: 70%;
    }

/*------------------------------------ラインナップ*/

/*グレードを比較*/
.gread{
    display: flex;
    -js-display: flex;/*ポリフィル*/
    align-items: stretch;
    position: relative;
    justify-content: space-between;
}
.gread .gread_inner{
    flex-basis: 33.3%;
    /*display: flex;
    flex-direction: column;*/
    background: #eee;
    padding: 0 0 4em;
    border-right:1px solid #fff;
}
.gread_head{
    color:#fff;

    padding:  10px ;
}

.ex .gread_head{
    background: #498ecc;
}

.pro .gread_head{
    background: #7dcdd8;
}

.value .gread_head{
    background: #a9d12d;
}

.gread_head h3 {
    font-size: 70%;
    margin-bottom: 5px;
    font-weight: normal;
	letter-spacing: normal;
}

.gread_head h4{
    font-weight: 800;
    font-size: 1.4vw;
}
/*=改行対策 */
@media screen and (min-width: 1980px) {
    .gread_head h4{
        font-weight: 800;
        font-size: 1.15vw;

    }
}

.gread_body{}

.gread_body .lineup_pk{
    margin-bottom:0 ;
}

.gread_body .list-mark{
    margin-bottom: 10px;

}
.gread_body .date{
    padding: 30px;
    min-height: 11em;
}
.gread_body .date li{
    /*display: inline-block;*/
}

.gread_body .date h5{
    margin-bottom: 20px;
    font-weight: 800;
    font-size: 1.2em;
    line-height: 1.4;
}

.gread_body ul{
    font-size: 90%;
}
.grad_footer{
    position: absolute;
    bottom:0;
    width: 33.3%;
    padding-bottom: 20px;
}
.grad_footer ul{
    width: 100%;
}
.grad_footer ul li a{
    padding: 10px;
    width: 90%;
    margin: 0 auto;
}

/*APP storeボタン*/
.lineup .fv_buttons_set{
    max-width:100%;
    margin-bottom: 0;
}

.lineup .fv_buttons_left p{
    text-align: right;
}
.lineup .app_store a span.icon-appleinc {
    margin-right: 8px;
    position: relative;
    top: 0;
    font-size: 150%;
    height: 46px;
    line-height: 46px;
}

.lineup .app_store a span {
    white-space: nowrap;
}
.lineup .app_store a {
    border: solid 1px #000;
    background-image: none;
    background-color: #eee;
    background: #000000;
    background: -moz-linear-gradient(top, #000000 56%, #666666 100%);
    background: -webkit-linear-gradient(top, #000000 56%,#666666 100%);
    background: linear-gradient(to bottom, #000000 56%,#666666 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#666666',GradientType=0 );
    height: auto;

    line-height: 1em !important;
    font-size: 100% !important;
    text-align: left;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
 background-repeat:repeat !important;
     background-position:0% 0% !important;
}
.lineup .app_store .btn_text{
    font-size: 90%;
}
.lineup .icon-appleinc{
    margin-top: -2px;
}
.lineup .icon-appleinc:before {

    font-size: 112%;
}
/*------------------------------------関連商品*/

.product .anchor{
    margin-bottom: 30px;
}

/*------------------------------------プラグイン　sdk*/

.sdk h2 em{
    font-size: 2.4em;
    font-weight: 800;
    line-height: 1.2;
}

.sdk h2 span{
    font-size: 1.5em;
    color:#999;
    margin-bottom: 10px;
    display: block;
}

.sdk .col_02-wrap{
    display: flex;
    justify-content: space-between;
}

.sdk .col_02-wrap >div{
    flex-basis:45%;
}

.sdk .other_btn_01{
    margin-bottom: 20px;
}



/*------------------------------------機能一覧*/

.funtion #Header{
    border-bottom: 1px solid #eee;
}

.function_list_Area-wrap {
    display: flex;
}

/*------------------------------------動画*/

.cleator_list{
    border: solid 1px #ccc;
    padding: 20px;
    margin-bottom: 30px;
}

.cleator_list ul{
    display: flex;
    flex-wrap: wrap;
}

.cleator_list ul li{
    line-height: 2;
    margin-right: 30px;
}

.cleator_list h4{
    margin-bottom: 20px;
}

.movie_box{
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
}

/*.movie_box　.movie_youtube{*/
    /*padding-bottom: 0*/
/*}*/

/*.movie_box　.movie_youtube iframe{*/
    /*position: relative;*/
/*}*/


.movie_box > div{

    border: solid 1px #ccc;
    padding: 10px 10px 20px 10px;
    flex-basis: 29%;
    margin-bottom: 60px;
}

.movie_box > div h3{

    font-size: 90%;

    font-weight: normal;
    margin-bottom: 0;
    margin-top: -10px;
}

.movie_box > div > div{

}

.more_Movie{

    align-items: center;
}

.more_Movie p{
    margin-bottom: 5px;
    font-weight: 600;
    text-align: center;
}


/*------------------------------------動作環境　システム*/

table.type03{
    background: #ffffff;
}

table.type03 p:last-child{
    margin-bottom: 0;
}

table.type03 {
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border-top: 1px solid #666;
    font-size: 90%;
    width: 100%;
}

table.type03 th {
    border-top: 1px solid #666;
    border-bottom: 1px solid #fff;
    padding: 8px;
    font-weight: bold;
    vertical-align: top;
    color: #fff;
    background: #666;
    text-align: left;
    width: 20%;
}
table.type03.yoko th {
    border-right: 1px solid #fff;
    border-bottom: 1px solid #666;
}

table.type03 td{
border-right: 1px solid #666;
    /*background: #fff;*/
}

table.type03 tbody td{
    border-left: 1px solid #666;

}

table.type03tbody th{
    vertical-align: middle;
    padding: 8px;
    border-bottom: 1px solid #666;
    text-align: center;
    border-right: 1px solid #666;
    /*background: #e4e7ec;*/
}

table.type03 .soft{
    width: 5em;
}

table.type03 td {
    padding: 8px;
    vertical-align: top;
    border-bottom: solid 1px #666;
}

/*------------------------------------アップグレード*/

.upWrap span {
    border-bottom: solid 5px #efea3a;
    font-weight: bold;
}

.upWrap{
    display: flex;
    -js-display: flex;/*ポリフィル*/
}

.pro_col_02{
    flex-basis: 32%;
    border:2px solid #7dcdd8;
    background: #ffffff;
}

.pro_col_02 h3{
    background: #7dcdd8;
    color: #ffffff;
    padding: 10px;
    margin-bottom: 0;
}

.pro_col_02 > div{
    padding:  10px 10px;
}

.pro_col_02 > div h4{
    margin-bottom: 10px;
    padding-left: 5px;
}

/*　矢印　*/
.allow_box{
    align-self:center;
    flex-basis: 3%;
    vertical-align: middle;
    padding-left: 5px;
    color: #ccc;
    font-size: 400%;
}

.ex_col_02{
    display: table-cell;
    flex-basis: 65%;
    background: #ffffff;
}

.ex_col_02 h3{
    background: #498ecc;
    color: #ffffff;
    padding: 10px;
    margin-bottom: 0;
}

.ex_col_02 > div{
    border:2px solid #498ecc;
}

.ex_col_02 > div table th{
    border-right:1px solid #498ecc;
    border-top:1px solid #498ecc;
    text-align: left;
    padding: 15px 10px;
    background: #f3f6f7 none repeat scroll 0 0;
    width: 23%;
}

.ex_col_02 > div table td{
    border-left:1px solid #498ecc;
    border-top:1px solid #498ecc;
    padding: 15px 10px;
}

/*右向き矢印*/
.right-direction-allow-box {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-basis: 3%;
    color: #ccc;
}

.right-direction-allow {
    font-size: 200% !important;
}


/*------------------------------------------ボリュームライセンス*/

.merit h2 em {
    background: linear-gradient(to bottom, rgba(239, 234, 58, 0) 0%, rgba(239, 234, 58, 0) 48%, rgba(239, 234, 58, 1) 49%, rgba(239, 234, 58, 1) 86%, rgba(239, 234, 58, 0) 87%);
    margin:0;
}

#volume_title{
    margin-bottom: 80px;
}
.volume-t h2{
    margin: 0 0 20px 0;
}
.list-disc li{
    list-style-type: disc;
    margin: 0 0 0.5em 3em;
    padding:0;
}
.list-disc-pdl30 li{
    list-style-type: disc;
    margin: 0 0 0.5em 5em;
    padding:0 0 0 0;
}
.pad_lft20{
   padding-left:20px;
}
.circle-num--title {
    width: 90px;
    height: 90px;
    font-size: 4.8rem;
    line-height: 90px;
    margin-bottom: 60px;
}
.circle-num {
    display: inline-block;
    text-align: center;
    color: #ffffff;
    background: #df3183;
    font-weight: bold;
    font-style: italic;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 2.8rem;
    line-height: 60px;
    width: 60px;
    height: 70px;
    float: left;
    margin-right: 10px;
}
.ft-normal{
    font-weight: normal;
}
.ft-small{
    font-size:1.0rem;

}
.ft-bold{
    font-weight: bold;
}
.pad_lft30{
    padding-left:30px;
}
.volumelicence-img01{
    margin-top: 20px;
}
.img50{
    max-width:520px;
    height:auto;
}

.img70{
    max-width:700px;
    height:auto;
}

/*表*/
.kakaku_waku{
	overflow: hidden;
}

.kakaku_waku table{
	float: left;
	font-size: 80%;
	margin-left: 20px;
}



section .point1{
    margin: 0 0 20px 0;
}
section .point2{
    margin: 60px 0;
}

.arrow{
    position: relative;
    display: inline-block;
    padding: 0 0 0 16px;
    color: #000;
    vertical-align: middle;
    text-decoration: none;
}
.arrow::before,
.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.link-arrow::before{
    left: 6px;
    box-sizing: border-box;
    width: 6px;
    height: 6px;
    border: 6px solid transparent;
    border-left: 6px solid #333333;
}
.item-details{
    margin: 20px 0 10px 0  !important;
}
.notice{
    margin: 10px 0 10px 0  !important;
    padding-left: 30px;
}
.item-details-dousa{
    margin: 20px 0 10px 0  !important;
    padding-left:20px;
}
.kakaku_waku{
    padding:0 0 0 30px;
}
.campaign_bnr{
    max-width: 640px;
    height: auto;
}
.campaign_red{
    color: #cc0000;
}
/*faq*/
.faq-waku{
    background:#f6f6f6;
    border-radius: 8px;
    padding:40px;
	margin-bottom: 40px;
}


.faq dt{
    font-weight: bold;
    padding-bottom: 10px;
    text-indent: -2.0em;
	margin-left: 1em;
}
.faq dd{
    margin-bottom: 26px;
    text-indent: -2.0em;
	margin-left: 1em;
}

/*一番下のボタン*/
.valume-button{
position: relative;
text-align: center;
margin-bottom: 40px;
}
.valume-button .fv_buttons_set{
position: absolute;
top:0;
bottom:0;
margin:30px auto 0 auto;
left:0;
right:0
}



/*--------------------------------------ボタンセット*/
.fv_buttons {
    width:100%;
    background-color:#222;
    height:100px;
    padding:25px 40px;
    box-sizing:border-box;
    overflow:hidden;
}
.fv_buttons_set {
    max-width:500px;
    width:100%;
    text-align:center;
    display:flex;
    margin: 50px 0;
}
.fv_illust .fv_buttons .fv_buttons_set {
    float:right;
}
.fv_manga .fv_buttons .fv_buttons_set {
    float:left;
}
.fv_buttons_set a {
    display:block;
    width:100%;
    height:50px;
    border-radius:5px;
    color:#fff;
    line-height:46px;
    font-size:26px;
    background-repeat:repeat-x;
    background-position:left bottom;
    box-sizing:border-box;
    text-decoration:none;
}
.fv_buttons_left, .fv_buttons_right {
    flex:1;
    box-sizing:border-box;
}
.fv_buttons_left {
    padding-right:10px;
}
.fv_buttons_set .fv_buttons_left a {
    background-image:url(/view/img/common/fv_bt_bg_orange.png);
    border:solid 2px #ed6b00;
}
.fv_buttons .fv_buttons_set .fv_buttons_left a {
    border:solid 2px #ffb066;
}

/*------------------------------------------利用規約*/
/*-----------------------------プライバシーポリシー*/
.information .section_wrapper_col:first-child{
    display: block;
    border:none;
}
.information .section_wrapper_col{
    display: flex;
    padding-top: 40px;
    margin-bottom: 40px;
    border-top:  1px solid #ddd;
}
.information .section_wrapper_col h2{
    flex-basis: 20%;
    font-size: 120%;
    padding-right: 2%;
}

.information .section_wrapper_col > div{
    flex-basis: 70%;
    padding-left: 2%;
}

.information .section_wrapper_col > div *:last-child{
    margin-bottom: 0;
}


/*-----------------------------------------------お問い合わせ(一部利用規約と共有)*/

.inquiry.information .section_wrapper_col:first-child,
.inquiry.information .section_wrapper_col{
    display: flex;
    padding-top: 40px;
    margin-bottom: 40px;
    border-top:  1px solid #ddd;
}
.inquiry.information .section_wrapper_col h2{
    flex-basis: 40%;
    font-size: 120%;
    padding-right: 2%;
}

.inquiry.information .section_wrapper_col > div{
    flex-basis: 50%;
    padding-left: 2%;
}

/*--------------------------------------------------------------機能紹介*/

.function_contents_wrap{
    display: flex;
    max-width:1380px;
    padding: 50px 40px 80px 40px;
    margin: 0 auto;
    box-sizing: border-box;
    justify-content:space-between;
}

.main_contents{
   flex-basis: 78%;
    order: 0;
}

/*サイドのナビゲーション*/
aside{
    flex-basis: 18%;
    order: 1;
    margin-top: 50px;
}

#nav {
    z-index: 100;
    text-align: right;
    border: solid 1px #333;
}

#nav a {
    text-decoration: none;
    font-weight: bold;
    color: #999;
    padding: 10px;
    /* border-bottom: 1px solid #ddd; */
    display: block;
    background: #ddd;
    flex-direction: column;
    margin-bottom: 1px;
}

#nav a:last-child{
    margin-bottom:0;
}

#nav a em{
    order: 1;
}

#nav a span{
    display: block;
    order: 0;
    font-family: 'Teko',sans-serif;
    font-size: 90%;
}

#nav li:last-child a{
    border:none;
}

#nav li{
    /*border-bottom:1px solid #ddd;*/
}

#nav .current{
    /*font-size: 140%;*/
    transition: all ease 0.5s;
}

#nav .current a{
    color: #fff;
    background: rgba(0, 0, 0, 0.8);
}

#nav .current a span{
    color:#ddd;
}

#nav li{
    text-align: left;
}

.function_contents_wrap .title_area:first-child{
    /*padding-top: 0px;*/
}

.function_contents_wrap h2 {
    border-top: 3px solid #333;
    padding: 20px 0 0 020px;

    border-left: 1px solid #ccc
}

.function_contents_wrap .title_area{/*アンカーリンクがヘッダー分ずれるので調整*/
margin-top: -100px;
padding-top: 150px;
}



.function_item{
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    padding: 50px 0 50px 0;
    justify-content: space-between;
}

.function_contents_wrap .function_item:last-child{
    border: none;
}

.function_item.non_flex{
    display: block;
}

/*ソフトのタイトル*/
.function_item .software{
    display: flex;
    color:#fff;
    margin-bottom: 10px;
}
.function_item .software li {
    display: inline-block;
    font-size: 70%;
    padding: 2px 10px;
    margin-bottom: 3px;
    font-weight: bold;
}

/*PC　iPad*/
.function_item .software li.device{
    color:#666 !important;
    padding: 2px 10px;
    margin-bottom: 3px;
}

/*画像*/
.function_item .image_set_box li{
    margin-bottom: 10px;

}

.function_item .image_set_box li:last-child {
    margin-bottom: 0;
}

.function_item .col_01{

    margin-bottom: 30px;
}

.function_item .col_01 h3 {
    font-size: 1.8em;
    margin-bottom: 20px;
    line-height: 1.3;
    font-weight: 600;
}


/*画像2つならび*/
.img_2col{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.img_2col > * {
    flex-basis: 49.5%;
}


.col_02-wrap02{
    display: flex;
    justify-content: space-between;
}

.col_02-wrap02 > .col_02{
    flex-basis: 43%;
    padding: 20px;
    border: 2px solid #ccc;
    border-radius: 5px;
}

/*:::::::ページ下のナビゲーション*/
.valuse-ttl h2{
    flex-basis: 20%;
    margin-right: 30px;
}

.valuse-ttl h2 img{
    max-width:100%;
}

.valuse-ttl > div{
    flex-basis: 70%;
}

.valuse-ttl > div h3{
    font-size: 140%;
    margin-bottom: 2px;
    margin-top: -4px;
}
.valuse-ttl > div > p{
    font-size: 90%;
}

/*タイル*/
.valuse-ttl{
    display: flex;
    -js-display: flex;
    margin-bottom: 30px;

}
.values{
    display: flex;
    -js-display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.values-row{
    flex-basis: 10%;
    flex-grow: 1;
    margin: 0 0.5% 0 0;
    position: relative;
    background: #ffffff;
}

.values-row a{
    text-decoration: none;
}

.values-row_body_inner{
    background: #ffffff none repeat scroll 0 0;
    padding: 10px 10px 5px;
    text-align: center;
}

.values-row_body{
    position: relative;
}

.values-row_body h4 {
    color: rgba(249, 249, 249, 0.9);
    font-family: "Teko", sans-serif;
    font-size: 200%;
    font-weight: 600;
    position: absolute;
    top: 5px;
}

.values-row_body h3{
    margin-bottom: 10px;
    font-size: 180%;
}

.values-row_body h3 em{
    font-family: 'Teko', sans-serif;
    font-size: 80%;
    font-weight: bold;
    line-height:0.9;
}

.values-row_body h3 span{
    font-size: 40%;
    display: block;
    margin-bottom: 3px;
}

.values-row_bottom{
    font-family:'Teko', sans-serif;
    font-weight: normal;
    text-align: center;
    position: absolute;
    bottom:0;
    width: 100%;
}

.values-row_bottom a{
    color: #fff;
    display: block;
    margin-top: -5px;
    padding: 5px;
    font-size: 120%;
}

/*::::コミック*/
.values-row  a{
    transition:  none;
}

.values-row  a:hover{
    opacity:1
}

.values-row_body{
    transition: background-color 0.2s ease 0s;
}

.values-row_body:hover{
    opacity: 1;
}

.values-row.comic .values-row_body{
    background: #9ff6ec url("../../../img/jp/top/cate_comic.png") no-repeat left top;
    background-blend-mode: multiply;
    background-size: 200%;
    padding-top:46%;
}

.values-row.comic .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_comic.png") no-repeat right  top;
    background-blend-mode:normal ;
    background-size: 200%;
    padding-top: 46%;
}

.comic .values-row_body{
    color: #11a191;
}
.comic .values-row_bottom{
    background: #11a196;
}

 /*IE10以降 （ブレンドプロパティが対応してないので）*/
@media all and (-ms-high-contrast:none){
    .values-row.comic .values-row_body{
        background: #9ff6ec url("../../../img/jp/top/cate_comic.png") no-repeat right top;
        background-size: 200%;
        padding-top:46%;
    }
}

/*::::アートイラスト*/
.values-row.illust .values-row_body{
    background: #72d5fa url("../../../img/jp/top/cate_illust.png") no-repeat left top;
    background-blend-mode: multiply;
    background-size: 200%;
    padding-top:46%;
}

.values-row.illust .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_illust.png") no-repeat right  top;
    background-blend-mode:normal ;
    background-size: 200%;
    padding-top: 46%;
}

.illust .values-row_body{
    color: #008bbb;
}
.illust .values-row_bottom{
    background: #008bbb;
}

/*IE10以降 （ブレンドプロパティが対応してないので）*/
@media all and (-ms-high-contrast:none){
    .values-row.illust .values-row_body{
        background: #fff url("../../../img/jp/top/cate_illust.png") no-repeat right  top;
        background-size: 200%;
        padding-top:46%;
    }
}


/*::::デザイン*/
.values-row.design .values-row_body{
    background: #ba97ff url("../../../img/jp/top/cate_desaign.png") no-repeat left top;
    background-blend-mode: multiply;
    background-size: 200%;
    padding-top:46%;
}

.values-row.design .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_desaign.png") no-repeat right  top;
    background-blend-mode:normal ;
    background-size: 200%;
    padding-top: 46%;
}

.design .values-row_body{
    color: #7b5ca5;
}
.design .values-row_bottom{
    background: #7b5ca5;
}

/*IE10以降 （ブレンドプロパティが対応してないので）*/
@media all and (-ms-high-contrast:none){
    .values-row.design .values-row_body{
        background: #fff url("../../../img/jp/top/cate_desaign.png") no-repeat right  top;
        background-size: 200%;
        padding-top:46%;
    }
}



/*::::マンガ*/
.values-row.manga  .values-row_body{
    background: rgba(84, 146, 233, 0.61) url("../../../img/jp/top/cate_manga.png") no-repeat;
    background-blend-mode: multiply;
    background-size: 100%;
    padding-top:46%;
}

.values-row.manga .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_manga.png") no-repeat;
    background-blend-mode:normal ;
    background-size: 100%;
    padding-top: 46%;
}

.manga .values-row_body{
    color: #4980cc;
}
.manga .values-row_bottom{
    background: #4980cc;
}



/*::::アニメ*/
.values-row.anima  .values-row_body{
    background: rgba(255, 109, 153, 0.55) url("../../../img/jp/top/cate_anima.png") no-repeat left top;
    background-blend-mode: multiply;
    background-size: 200%;
    padding-top:46%;
}

.values-row.anima .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_anima.png") no-repeat right top;
    background-blend-mode:normal ;
    background-size: 200%;
    padding-top: 46%;
}

.anima .values-row_body{
    color: #eb668c;
}
.anima .values-row_bottom{
    background: #eb668c;
}


/*IE10以降 （ブレンドプロパティが対応してないので）*/
@media all and (-ms-high-contrast:none){
    .values-row.anima  .values-row_body{
        background: #fff url("../../../img/jp/top/cate_anima.png") no-repeat right  top;
        background-size: 200%;
        padding-top:46%;
    }
}


/*::::本*/
.values-row.book  .values-row_body{
    background: rgba(136, 255, 66, 0.47) url("../../../img/jp/top/cate_book.png") no-repeat left top;
    background-blend-mode: multiply;
    background-size: 200%;
    padding-top:46%;
}

.values-row.book .values-row_body:hover{
    background: #fff url("../../../img/jp/top/cate_book.png") no-repeat right  top;
    background-blend-mode:normal ;
    background-size: 200%;
    padding-top: 46%;
}

.book .values-row_body{
    color: #63b72f;
}

.book .values-row_bottom{
    background: #63b72f;
}

/*IE10以降 （ブレンドプロパティが対応してないので）*/
@media all and (-ms-high-contrast:none){
    .values-row.book  .values-row_body{
        background: #fff url("../../../img/jp/top/cate_book.png") no-repeat right  top;
        background-size: 200%;
        padding-top:46%;
    }
}


/*------------------------ニュース（アンケート）*/

.news #Title-hedding .title_block h1{
    font-size: 1.3em !important;
}

.news .section_wrapper{
    padding-bottom: 300px;
}
/*=============================================================================980px以下用（PC用）の記述 */
@media screen and (max-width: 980px) {
    .Title-hedding{
        overflow: hidden;
        min-width: 980px;

    }
}