/*=============================================================*/
/*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: 10px 40px 80px 40px!important;
    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-top: 40px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 30px;
    display: flex;
    /*-js-display: flex;!*ポリフィル*!*/
    justify-content: space-between;
}

.itemBox02_book2 {
    display: flex;
    /*-js-display: flex;!*ポリフィル*!*/
    justify-content: space-between;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0;
}

.itemBox02_book2:last-child {
    border-bottom: none;
}
.itemBox02_book2 .itemBox02 {

    border-bottom: none;
    margin-top: 30px;
    margin-bottom: 30px;
    padding-bottom: 0;
}

.itemBox02_book2.lineup_pk {
    margin: 0 0 0 0;
}

.lineup_pk.border {
    box-shadow: 0 0 10px #8e8e8e;
}
.itemBox02_book2 > div {
    width: 48%;
}

.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;

}

.oldbook {
    font-size: 1.2em !important;
    margin-bottom: 20px;
}

.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_book {
    flex-basis: 25%;
    margin-right: 20px;
}

.itemBox02_book2 .spec {
    padding-bottom: 25px;
}

.itemBox02_book2 .itemBox02-innter_col01_book {
    flex-basis: 40%;
    margin-right: 20px;
}

.itemBox02_book2 .itemBox02-innter_col01_book ul {
    padding-bottom: 0;
}
.itemBox02-innter_col01_book .lineup_pk {
    align-items: center;
    text-align: center;
}

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


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

.itemBox02-innter_col01_book .spec {
    border-top: 1px solid #333;
}

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

.itemBox02-innter_col01_book .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: 60px;
    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;

    }
}


img {
    transition: all 1.8s;
}

.lazyload {
    opacity: 0;
}

.lazyloaded {
    opacity: 1;
}