/*
=============================
目次用スタイル(SIRIUS2)
=============================
*/
@import url("https://fonts.googleapis.com/css2?family=Caveat&display=swap");/* デザイン6で使用 */
@import url("https://fonts.googleapis.com/css2?family=Yeseva+One&display=swap");/* デザイン7で使用 */
/* 目次 カラーバリエーション
==================================================
*/
/* ブラック（デフォルト） */
#indexlist{
background-color:#f9f9fb;
}
#indexlist #index_button{
color:#2f2f32;
}
#indexlist #index_button > span::before,#indexlist #index_button > span::after{
border-color:#2f2f32;
}
#indexlist ol > li > span::before{
color:#2f2f32;
}
/* レッド */
#indexlist.red{
background-color:#fdf5f5;
}
#indexlist.red #index_button{
color:#c83535;
}
#indexlist.red #index_button > span::before,#indexlist.red #index_button > span::after{
border-color:#c83535;
}
#indexlist.red ol > li > span::before{
color:#c83535;
}
/* オレンジ */
#indexlist.orange{
background-color:#fdf6ef;
}
#indexlist.orange #index_button{
color:#de7e1e;
}
#indexlist.orange #index_button > span::before,#indexlist.orange #index_button > span::after{
border-color:#de7e1e;
}
#indexlist.orange ol > li > span::before{
color:#de7e1e;
}
/* ブラウン */
#indexlist.brown{
background-color:#f9f8f4;
}
#indexlist.brown #index_button{
color:#958462;
}
#indexlist.brown #index_button > span::before,#indexlist.brown #index_button > span::after{
border-color:#958462;
}
#indexlist.brown ol > li > span::before{
color:#958462;
}
/* イエロー */
#indexlist.yellow{
background-color:#fcfceb;
}
#indexlist.yellow #index_button{
color:#c3ad03;
}
#indexlist.yellow #index_button > span::before,#indexlist.yellow #index_button > span::after{
border-color:#e7cd08;
}
#indexlist.yellow ol > li > span::before{
color:#dac100;
}
/* グリーン */
#indexlist.green{
background-color:#f2faf7;
}
#indexlist.green #index_button{
color:#38a05d;
}
#indexlist.green #index_button > span::before,#indexlist.green #index_button > span::after{
border-color:#38a05d;
}
#indexlist.green ol > li > span::before{
color:#38a05d;
}
/* シアン */
#indexlist.cyan{
background-color:#f4fbfc;
}
#indexlist.cyan #index_button{
color:#37939f;
}
#indexlist.cyan #index_button > span::before,#indexlist.cyan #index_button > span::after{
border-color:#51bccb;
}
#indexlist.cyan ol > li > span::before{
color:#3dabba;
}
/* ブルー */
#indexlist.blue{
background-color:#f5f9ff;
}
#indexlist.blue #index_button{
color:#2966d7;
}
#indexlist.blue #index_button > span::before,#indexlist.blue #index_button > span::after{
border-color:#3877e5;
}
#indexlist.blue ol > li > span::before{
color:#3877e5;
}
/* ネイビー */
#indexlist.navy{
background-color:#f5f6fc;
}
#indexlist.navy #index_button{
color:#49508a;
}
#indexlist.navy #index_button > span::before,#indexlist.navy #index_button > span::after{
border-color:#6269a2;
}
#indexlist.navy ol > li > span::before{
color:#646a9d;
}
/* パープル */
#indexlist.purple{
background-color:#fbf5fc;
}
#indexlist.purple #index_button{
color:#985aa3;
}
#indexlist.purple #index_button > span::before,#indexlist.purple #index_button > span::after{
border-color:#a260ad;
}
#indexlist.purple ol > li > span::before{
color:#a260ad;
}
/* ピンク */
#indexlist.pink{
background-color:#fef7f9;
}
#indexlist.pink #index_button{
color:#cf6975;
}
#indexlist.pink #index_button > span::before,#indexlist.pink #index_button > span::after{
border-color:#fba0ab;
}
#indexlist.pink ol > li > span::before{
color:#f2909c;
}
/* グレー */
#indexlist.gray{
background-color:#f9f9fb;
}
#indexlist.gray #index_button{
color:#444445;
}
#indexlist.gray #index_button > span::before,#indexlist.gray #index_button > span::after{
border-color:#aaaaab;
}
#indexlist.gray ol > li > span::before{
color:#959596;
}
/* デフォルト（シンプル）
==================================================
*/
#indexlist:not([class*="idx_design"]) #index_inner{
padding:20px 24px;
}
#indexlist:not([class*="idx_design"]) .title{
display:inline-block;
font-size:18px;
padding-right:40px;
}
#indexlist:not([class*="idx_design"]) ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.33334em;
top:.66667em;
width:.33334em;
height:.33334em;
z-index:1;
}
/* デフォルト（シンプル） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist:not([class*="idx_design"]) ul > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist:not([class*="idx_design"]).red ul > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist:not([class*="idx_design"]).orange ul > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist:not([class*="idx_design"]).brown ul > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist:not([class*="idx_design"]).yellow ul > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist:not([class*="idx_design"]).green ul > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist:not([class*="idx_design"]).cyan ul > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist:not([class*="idx_design"]).blue ul > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist:not([class*="idx_design"]).navy ul > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist:not([class*="idx_design"]).purple ul > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist:not([class*="idx_design"]).pink ul > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist:not([class*="idx_design"]).gray ul > li > span::before{
background-color:#aaaaab;
}
/* デザイン1（シンプル_点線）
==================================================
*/
#indexlist.idx_design1{
border:2px dashed #e6e6e8;
}
#indexlist.idx_design1 #index_inner{
padding:26px 32px;
text-align:center;
}
#indexlist.idx_design1 .title{
display:inline-block;
font-size:18px;
padding:0 40px;
}
#indexlist.idx_design1 #index_button{
top:17px;
}
#indexlist.idx_design1 ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.33334em;
top:.66667em;
width:.33334em;
height:.33334em;
z-index:1;
}
/* デザイン1（シンプル_点線） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design1{
border-color:#e6e6e8;
}
#indexlist.idx_design1 ul > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design1.red{
border-color:#f7dddd;
}
#indexlist.idx_design1.red ul > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design1.orange{
border-color:#f8e0c7;
}
#indexlist.idx_design1.orange ul > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design1.brown{
border-color:#e7e3d5;
}
#indexlist.idx_design1.brown ul > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist.idx_design1.yellow{
border-color:#f6f397;
}
#indexlist.idx_design1.yellow ul > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design1.green{
border-color:#d2eee4;
}
#indexlist.idx_design1.green ul > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist.idx_design1.cyan{
border-color:#cfeef2;
}
#indexlist.idx_design1.cyan ul > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design1.blue{
border-color:#d7e6fc;
}
#indexlist.idx_design1.blue ul > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design1.navy{
border-color:#e5e6eb;
}
#indexlist.idx_design1.navy ul > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist.idx_design1.purple{
border-color:#f2e1f5;
}
#indexlist.idx_design1.purple ul > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design1.pink{
border-color:#fae3ea;
}
#indexlist.idx_design1.pink ul > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design1.gray{
border-color:#ebebed;
}
#indexlist.idx_design1.gray ul > li > span::before{
background-color:#aaaaab;
}
/* デザイン2（ライン）
==================================================
*/
#indexlist.idx_design2{
background-color:#fff;
border:2px solid #e6e6e8;
}
#indexlist.idx_design2 #index_inner{
padding:20px 24px;
text-align:center;
}
#indexlist.idx_design2 #index_inner > ul,#indexlist.idx_design2 #index_inner > ol{
border-top:2px dotted #e6e6e8;
padding-top:17px;
}
#indexlist.idx_design2 .title{
display:inline-block;
font-size:18px;
padding:0 40px;
}
#indexlist.idx_design2 ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.33334em;
top:.66667em;
width:.33334em;
height:.33334em;
z-index:1;
}
/* デザイン2（ライン） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design2{
border-color:#e6e6e8;
}
#indexlist.idx_design2 #index_inner > ul,#indexlist.idx_design2 #index_inner > ol{
border-top-color:#e6e6e8;
}
#indexlist.idx_design2 ul > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design2.red{
border-color:#f7dddd;
}
#indexlist.idx_design2.red #index_inner > ul,#indexlist.idx_design2.red #index_inner > ol{
border-top-color:#f7dddd;
}
#indexlist.idx_design2.red ul > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design2.orange{
border-color:#f8e0c7;
}
#indexlist.idx_design2.orange #index_inner > ul,#indexlist.idx_design2.orange #index_inner > ol{
border-top-color:#f8e0c7;
}
#indexlist.idx_design2.orange ul > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design2.brown{
border-color:#e7e3d5;
}
#indexlist.idx_design2.brown #index_inner > ul,#indexlist.idx_design2.brown #index_inner > ol{
border-top-color:#e7e3d5;
}
#indexlist.idx_design2.brown ul > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist.idx_design2.yellow{
border-color:#f6f397;
}
#indexlist.idx_design2.yellow #index_inner > ul,#indexlist.idx_design2.yellow #index_inner > ol{
border-top-color:#f6f397;
}
#indexlist.idx_design2.yellow ul > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design2.green{
border-color:#d2eee4;
}
#indexlist.idx_design2.green #index_inner > ul,#indexlist.idx_design2.green #index_inner > ol{
border-top-color:#d2eee4;
}
#indexlist.idx_design2.green ul > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist.idx_design2.cyan{
border-color:#cfeef2;
}
#indexlist.idx_design2.cyan #index_inner > ul,#indexlist.idx_design2.cyan #index_inner > ol{
border-top-color:#cfeef2;
}
#indexlist.idx_design2.cyan ul > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design2.blue{
border-color:#d7e6fc;
}
#indexlist.idx_design2.blue #index_inner > ul,#indexlist.idx_design2.blue #index_inner > ol{
border-top-color:#d7e6fc;
}
#indexlist.idx_design2.blue ul > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design2.navy{
border-color:#e5e6eb;
}
#indexlist.idx_design2.navy #index_inner > ul,#indexlist.idx_design2.navy #index_inner > ol{
border-top-color:#e5e6eb;
}
#indexlist.idx_design2.navy ul > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist.idx_design2.purple{
border-color:#f2e1f5;
}
#indexlist.idx_design2.purple #index_inner > ul,#indexlist.idx_design2.purple #index_inner > ol{
border-top-color:#f2e1f5;
}
#indexlist.idx_design2.purple ul > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design2.pink{
border-color:#fae3ea;
}
#indexlist.idx_design2.pink #index_inner > ul,#indexlist.idx_design2.pink #index_inner > ol{
border-top-color:#fae3ea;
}
#indexlist.idx_design2.pink ul > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design2.gray{
border-color:#ebebed;
}
#indexlist.idx_design2.gray #index_inner > ul,#indexlist.idx_design2.gray #index_inner > ol{
border-top-color:#ebebed;
}
#indexlist.idx_design2.gray ul > li > span::before{
background-color:#aaaaab;
}
/* デザイン3（ライン_横線）
==================================================
*/
#indexlist.idx_design3{
background-color:#fff;
border-top:2px dotted #c4c4c5;
border-bottom:2px dotted #c4c4c5;
margin:14px 0 0;
}
#indexlist.idx_design3 #index_inner{
box-sizing:border-box;
line-height:0;
padding:20px 16px;
min-height:58px;
}
#indexlist.idx_design3 #index_inner > ul,#indexlist.idx_design3 #index_inner > ol{
margin:22px 0 0;
}
#indexlist.idx_design3 .title{
background-color:#2f2f32;
box-sizing:border-box;
color:#fff;
display:inline-block;
font-size:18px;
line-height:1.5;
padding:2px 32px;
position:relative;
left:-16px;
margin-top:-36px;
vertical-align:top;
max-width:calc(100% - 24px);
}
#indexlist.idx_design3 #index_button{
top:7px;
right:0;
}
#indexlist.idx_design3 ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.33334em;
top:.66667em;
width:.33334em;
height:.33334em;
z-index:1;
}
/* 角丸の指定 */
#indexlist.idx_design3.idx_round{
border-radius:0;
}
#indexlist.idx_design3.idx_round .title{
border-radius:30px;
}
/* デザイン3（ライン_横線） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design3{
border-color:#c4c4c5;
}
#indexlist.idx_design3 .title{
background-color:#2f2f32;
}
#indexlist.idx_design3 ul > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design3.red{
border-color:#efc6c6;
}
#indexlist.idx_design3.red .title{
background-color:#c83535;
}
#indexlist.idx_design3.red ul > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design3.orange{
border-color:#f6dabf;
}
#indexlist.idx_design3.orange .title{
background-color:#de7e1e;
}
#indexlist.idx_design3.orange ul > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design3.brown{
border-color:#dedbd4;
}
#indexlist.idx_design3.brown .title{
background-color:#958462;
}
#indexlist.idx_design3.brown ul > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist.idx_design3.yellow{
border-color:#f8f1b9;
}
#indexlist.idx_design3.yellow .title{
background-color:#e7cd08;
}
#indexlist.idx_design3.yellow ul > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design3.green{
border-color:#c4e4cf;
}
#indexlist.idx_design3.green .title{
background-color:#38a05d;
}
#indexlist.idx_design3.green ul > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist.idx_design3.cyan{
border-color:#cdecf0;
}
#indexlist.idx_design3.cyan .title{
background-color:#51bccb;
}
#indexlist.idx_design3.cyan ul > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design3.blue{
border-color:#c7d8f8;
}
#indexlist.idx_design3.blue .title{
background-color:#3877e5;
}
#indexlist.idx_design3.blue ul > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design3.navy{
border-color:#d0d2e3;
}
#indexlist.idx_design3.navy .title{
background-color:#6269a2;
}
#indexlist.idx_design3.navy ul > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist.idx_design3.purple{
border-color:#e4d2e8;
}
#indexlist.idx_design3.purple .title{
background-color:#a260ad;
}
#indexlist.idx_design3.purple ul > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design3.pink{
border-color:#fee4e7;
}
#indexlist.idx_design3.pink .title{
background-color:#fba0ab;
}
#indexlist.idx_design3.pink ul > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design3.gray{
border-color:#e7e7e7;
}
#indexlist.idx_design3.gray .title{
background-color:#aaaaab;
}
#indexlist.idx_design3.gray ul > li > span::before{
background-color:#aaaaab;
}
/* デザイン4（ビジネス）
==================================================
*/
#indexlist.idx_design4{
background-color:#fff;
}
#indexlist.idx_design4 #index_inner{
padding:0;
}
#indexlist.idx_design4 .title{
background-color:#2f2f32;
color:#fff;
display:block;
font-size:18px;
padding:13px 54px 13px 43px;
}
#indexlist.idx_design4 .title::before{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2219%22%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M12%202v13.561l-4.04-2.299-.993-.565-.991.569L2%2015.546V2h10m2-2H0v19l6.97-4L14%2019V0z%22%2F%3E%3C%2Fsvg%3E");
background-position:center left;
background-repeat:no-repeat;
content:'';
opacity:0.65;
position:absolute;
top:18px;
width:14px;
height:19px;
left:19px;
}
#indexlist.idx_design4 #index_button{
top:5px;
right:5px;
}
#indexlist.idx_design4 #index_button > span::before{
border-top:1px solid #fff;
border-right:1px solid #fff;
opacity:.75;
}
#indexlist.idx_design4 ul,#indexlist.idx_design4 ol{
margin-top:0;
margin-bottom:0;
}
#indexlist.idx_design4 #index_inner > ul,#indexlist.idx_design4 #index_inner > ol{
border-left:1px solid #e6e6e8;
border-right:1px solid #e6e6e8;
border-bottom:1px solid #e6e6e8;
margin:0;
overflow:hidden;
}
#indexlist.idx_design4 #index_inner > ul > li:last-child > span::after,#indexlist.idx_design4 #index_inner > ol > li:last-child > span::after{
border:none;
}
#indexlist.idx_design4 li{
margin:0;
}
#indexlist.idx_design4 li span{
display:flex;
position:relative;
z-index:0;
}
#indexlist.idx_design4 li span::after{
background-color:#fff;
border-bottom:1px solid #f5f5f6;
content:'';
position:absolute;
top:0;
left:-100%;
right:0;
bottom:0;
z-index:-1;
}
#indexlist.idx_design4 li span:hover::after{
background-color:#fbfbfc;
}
#indexlist.idx_design4 li a{
color:inherit;
display:block;
padding:1em;
text-decoration:none;
}
#indexlist.idx_design4 ul > li > span::before{
border:.26667em solid transparent;
border-left:.46667em solid #2f2f32;
content:'';
position:absolute;
left:-.13334em;
top:1.46667em;
z-index:1;
}
#indexlist.idx_design4 ol{
counter-reset:indexchild;
}
#indexlist.idx_design4 ol > li > span{
display:flex;
margin-left:-1.46667em;
}
#indexlist.idx_design4 ol > li > span::before{
padding:1em;
padding-right:0;
margin-right:-0.6em;
}
/* 角丸の指定 */
#indexlist.idx_design4.idx_round .title{
border-radius:8px 8px 0 0;
}
#indexlist.idx_design4.idx_round #index_inner > ul,#indexlist.idx_design4.idx_round #index_inner > ol{
border-radius:0 0 8px 8px;
}
/* デザイン4（ビジネス） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design4 .title{
background-color:#2f2f32;
}
#indexlist.idx_design4 #index_inner > ul,#indexlist.idx_design4 #index_inner > ol{
border-color:#e6e6e8;
}
#indexlist.idx_design4 li span::after{
border-color:#f5f5f6;
}
#indexlist.idx_design4 li span:hover::after{
background-color:#fbfbfc;
}
#indexlist.idx_design4 ul > li > span::before{
border-left-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design4.red .title{
background-color:#c83535;
}
#indexlist.idx_design4.red #index_inner > ul,#indexlist.idx_design4.red #index_inner > ol{
border-color:#f6dddd;
}
#indexlist.idx_design4.red li span::after{
border-color:#fbf1f1;
}
#indexlist.idx_design4.red li span:hover::after{
background-color:#fef8f8;
}
#indexlist.idx_design4.red ul > li > span::before{
border-left-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design4.orange .title{
background-color:#de7e1e;
}
#indexlist.idx_design4.orange #index_inner > ul,#indexlist.idx_design4.orange #index_inner > ol{
border-color:#f9e3cb;
}
#indexlist.idx_design4.orange li span::after{
border-color:#fdf4ea;
}
#indexlist.idx_design4.orange li span:hover::after{
background-color:#fef8f3;
}
#indexlist.idx_design4.orange ul > li > span::before{
border-left-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design4.brown .title{
background-color:#958462;
}
#indexlist.idx_design4.brown #index_inner > ul,#indexlist.idx_design4.brown #index_inner > ol{
border-color:#e7e4d8;
}
#indexlist.idx_design4.brown li span::after{
border-color:#f5f4ef;
}
#indexlist.idx_design4.brown li span:hover::after{
background-color:#fbfaf7;
}
#indexlist.idx_design4.brown ul > li > span::before{
border-left-color:#958462;
}
/* イエロー */
#indexlist.idx_design4.yellow .title{
background-color:#e7cd08;
}
#indexlist.idx_design4.yellow #index_inner > ul,#indexlist.idx_design4.yellow #index_inner > ol{
border-color:#eceaa6;
}
#indexlist.idx_design4.yellow li span::after{
border-color:#f7f7db;
}
#indexlist.idx_design4.yellow li span:hover::after{
background-color:#fdfdf0;
}
#indexlist.idx_design4.yellow ul > li > span::before{
border-left-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design4.green .title{
background-color:#38a05d;
}
#indexlist.idx_design4.green #index_inner > ul,#indexlist.idx_design4.green #index_inner > ol{
border-color:#d9e8e2;
}
#indexlist.idx_design4.green li span::after{
border-color:#f0f6f3;
}
#indexlist.idx_design4.green li span:hover::after{
background-color:#f5fbf9;
}
#indexlist.idx_design4.green ul > li > span::before{
border-left-color:#38a05d;
}
/* シアン */
#indexlist.idx_design4.cyan .title{
background-color:#51bccb;
}
#indexlist.idx_design4.cyan #index_inner > ul,#indexlist.idx_design4.cyan #index_inner > ol{
border-color:#d8e7e9;
}
#indexlist.idx_design4.cyan li span::after{
border-color:#eff5f6;
}
#indexlist.idx_design4.cyan li span:hover::after{
background-color:#f7fcfd;
}
#indexlist.idx_design4.cyan ul > li > span::before{
border-left-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design4.blue .title{
background-color:#3877e5;
}
#indexlist.idx_design4.blue #index_inner > ul,#indexlist.idx_design4.blue #index_inner > ol{
border-color:#dee6f1;
}
#indexlist.idx_design4.blue li span::after{
border-color:#f2f5f9;
}
#indexlist.idx_design4.blue li span:hover::after{
background-color:#f8fbff;
}
#indexlist.idx_design4.blue ul > li > span::before{
border-left-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design4.navy .title{
background-color:#6269a2;
}
#indexlist.idx_design4.navy #index_inner > ul,#indexlist.idx_design4.navy #index_inner > ol{
border-color:#e6e7ed;
}
#indexlist.idx_design4.navy li span::after{
border-color:#f5f5f8;
}
#indexlist.idx_design4.navy li span:hover::after{
background-color:#f8f8fd;
}
#indexlist.idx_design4.navy ul > li > span::before{
border-left-color:#6269a2;
}
/* パープル */
#indexlist.idx_design4.purple .title{
background-color:#a260ad;
}
#indexlist.idx_design4.purple #index_inner > ul,#indexlist.idx_design4.purple #index_inner > ol{
border-color:#ecddef;
}
#indexlist.idx_design4.purple li span::after{
border-color:#f7f1f9;
}
#indexlist.idx_design4.purple li span:hover::after{
background-color:#fcf8fd;
}
#indexlist.idx_design4.purple ul > li > span::before{
border-left-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design4.pink .title{
background-color:#fba0ab;
}
#indexlist.idx_design4.pink #index_inner > ul,#indexlist.idx_design4.pink #index_inner > ol{
border-color:#f9e1e8;
}
#indexlist.idx_design4.pink li span::after{
border-color:#fdf3f6;
}
#indexlist.idx_design4.pink li span:hover::after{
background-color:#fef9fb;
}
#indexlist.idx_design4.pink ul > li > span::before{
border-left-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design4.gray .title{
background-color:#aaaaab;
}
#indexlist.idx_design4.gray #index_inner > ul,#indexlist.idx_design4.gray #index_inner > ol{
border-color:#ebebed;
}
#indexlist.idx_design4.gray li span::after{
border-color:#f7f7f8;
}
#indexlist.idx_design4.gray li span:hover::after{
background-color:#fbfbfc;
}
#indexlist.idx_design4.gray ul > li > span::before{
border-left-color:#aaaaab;
}
/* デザイン5（ポップ）
==================================================
*/
#indexlist.idx_design5{
margin:20px 0 0;
}
#indexlist.idx_design5 #index_inner{
padding:26px 32px;
padding-top:0;
text-align:center;
}
#indexlist.idx_design5 #index_inner::before{
display:block;
content:'';
margin-bottom:-20px;
}
#indexlist.idx_design5 #index_inner > ul,#indexlist.idx_design5 #index_inner > ol{
margin:30px 0 0;
}
#indexlist.idx_design5 .title{
background-color:#2f2f32;
border-radius:30px;
box-sizing:border-box;
color:#fff;
display:inline-block;
font-size:18px;
padding:7px 64px;
position:relative;
vertical-align:top;
}
#indexlist.idx_design5 .title::before{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2215%22%3E%3Cg%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20fill%3D%22%23FFF%22%3E%3Cpath%20d%3D%22M1.5%200a1.5%201.5%200%2011-.001%203.001A1.5%201.5%200%20011.5%200zM6.5%200h12a1.5%201.5%200%20010%203h-12a1.5%201.5%200%20010-3zM1.5%206a1.5%201.5%200%2011-.001%203.001A1.5%201.5%200%20011.5%206zM6.5%206h12a1.5%201.5%200%20010%203h-12a1.5%201.5%200%20010-3zM1.5%2012a1.5%201.5%200%2011-.001%203.001A1.5%201.5%200%20011.5%2012zM6.5%2012h12a1.5%201.5%200%20010%203h-12a1.5%201.5%200%20010-3z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-position:center left;
background-repeat:no-repeat;
content:'';
display:inline-block;
margin-left:-33px;
margin-right:13px;
opacity:0.65;
position:absolute;
top:13px;
width:20px;
height:15px;
flex-shrink:0;
}
#indexlist.idx_design5 #index_button{
display:inline-block;
position:relative;
margin-left:-44px;
margin-top:-22px;
top:20px;
right:5px;
vertical-align:top;
}
#indexlist.idx_design5 #index_button > span::before{
border-top:1px solid #fff;
border-right:1px solid #fff;
opacity:.75;
}
#indexlist.idx_design5 li a{
color:inherit;
text-decoration:none;
}
#indexlist.idx_design5 li a:hover{
text-decoration:underline;
}
#indexlist.idx_design5 ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.13334em;
top:.26667em;
width:.93334em;
height:.93334em;
z-index:1;
}
#indexlist.idx_design5 ul > li > span::after{
border:.2em solid transparent;
border-left:.33334em solid #fff;
content:'';
position:absolute;
left:.46667em;
top:.53334em;
z-index:1;
}
#indexlist.idx_design5 ol > li > span{
align-items:flex-start;
}
#indexlist.idx_design5 ol > li > span::before{
background-color:#2f2f32;
border-radius:100vw;
box-sizing:border-box;
content:counter(indexchild);
color:#fff;
display:flex;
justify-content:center;
align-items:center;
font-size:.66667em;
line-height:1;
margin:0 .4em 0 .2em;
min-width:1.6em;
height:1.6em;
padding:0 .5em;
position:relative;
top:.3em;
}
#indexlist.idx_design5.idx_counters #index_inner > ol > li > span::before{
content:counter(indexchild);
}
#indexlist.idx_design5.idx_counters ul ol > li > span::before,#indexlist.idx_design5.idx_counters ol ol > li > span::before{
content:counters(indexchild,"-");
}
/* 角丸の指定 */
#indexlist.idx_design5.idx_round{
border-radius:20px;
}
/* デザイン5（ポップ） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design5 .title{
background-color:#2f2f32;
}
#indexlist.idx_design5 ul > li > span::before,#indexlist.idx_design5 ol > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design5.red .title{
background-color:#c83535;
}
#indexlist.idx_design5.red ul > li > span::before,#indexlist.idx_design5.red ol > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design5.orange .title{
background-color:#de7e1e;
}
#indexlist.idx_design5.orange ul > li > span::before,#indexlist.idx_design5.orange ol > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design5.brown .title{
background-color:#958462;
}
#indexlist.idx_design5.brown ul > li > span::before,#indexlist.idx_design5.brown ol > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist.idx_design5.yellow .title{
background-color:#e7cd08;
}
#indexlist.idx_design5.yellow ul > li > span::before,#indexlist.idx_design5.yellow ol > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design5.green .title{
background-color:#38a05d;
}
#indexlist.idx_design5.green ul > li > span::before,#indexlist.idx_design5.green ol > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist.idx_design5.cyan .title{
background-color:#51bccb;
}
#indexlist.idx_design5.cyan ul > li > span::before,#indexlist.idx_design5.cyan ol > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design5.blue .title{
background-color:#3877e5;
}
#indexlist.idx_design5.blue ul > li > span::before,#indexlist.idx_design5.blue ol > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design5.navy .title{
background-color:#6269a2;
}
#indexlist.idx_design5.navy ul > li > span::before,#indexlist.idx_design5.navy ol > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist.idx_design5.purple .title{
background-color:#a260ad;
}
#indexlist.idx_design5.purple ul > li > span::before,#indexlist.idx_design5.purple ol > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design5.pink .title{
background-color:#fba0ab;
}
#indexlist.idx_design5.pink ul > li > span::before,#indexlist.idx_design5.pink ol > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design5.gray .title{
background-color:#aaaaab;
}
#indexlist.idx_design5.gray ul > li > span::before,#indexlist.idx_design5.gray ol > li > span::before{
background-color:#aaaaab;
}
/* デザイン6（手書き）
==================================================
*/
#indexlist.idx_design6{
background-image:linear-gradient(rgba(255,255,255,0.35) 3%,rgba(255,255,255,0.35) 3%,transparent 3%,transparent 97%,rgba(255,255,255,0.35) 97%,rgba(255,255,255,0.35) 100%),linear-gradient(90deg,rgba(255,255,255,0.35) 3%,rgba(255,255,255,0.35) 3%,transparent 3%,transparent 97%,rgba(255,255,255,0.35) 97%,rgba(255,255,255,0.35) 100%);
background-size:20px 20px;
}
#indexlist.idx_design6 #index_inner{
padding:20px 24px;
text-align:center;
}
#indexlist.idx_design6 .title{
color:#2f2f32;
display:block;
font-family:'Caveat',cursive;
font-size:38px;
padding:0 40px;
}
#indexlist.idx_design6 #index_button{
top:26px;
right:15px;
}
#indexlist.idx_design6 #index_button > span::before,#indexlist.idx_design6 #index_button > span::after{
border:none;
border-bottom-width:2px;
border-bottom-style:solid;
box-sizing:border-box;
content:'';
position:absolute;
top:21px;
right:10px;
width:24px;
height:auto;
transition:.3s ease;
opacity:0.6;
}
#indexlist.idx_design6 #index_button > span::before{
transform:rotate(-45deg);
}
#indexlist.idx_design6 #index_button > span::after{
transform:rotate(45deg);
}
#indexlist.idx_design6 #index_button::before,#indexlist.idx_design6 #index_button::after{
display:none;
}
#indexlist.idx_design6 #index_panel:checked + #index_button > span::before{
transform:rotate(90deg);
}
#indexlist.idx_design6 #index_panel:checked + #index_button > span::after{
transform:rotate(180deg);
}
#indexlist.idx_design6 ul,#indexlist.idx_design6 ol{
margin:0;
margin-left:-6px;
}
#indexlist.idx_design6 #index_inner > ul,#indexlist.idx_design6 #index_inner > ol{
margin:0;
overflow:hidden;
}
#indexlist.idx_design6 li{
margin:0;
}
#indexlist.idx_design6 li span{
display:flex;
padding:0.8em 0 calc(.8em + 1px);
position:relative;
}
#indexlist.idx_design6 li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(227,227,230)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
background-position:left bottom;
background-repeat:repeat-x;
content:'';
position:absolute;
left:-100%;
right:0;
bottom:0;
height:1px;
}
#indexlist.idx_design6 li a{
text-decoration:none;
}
#indexlist.idx_design6 li a:hover{
text-decoration:underline;
}
#indexlist.idx_design6 ul > li > span::before{
border-bottom:.06667em solid transparent;
border-right:.06667em solid transparent;
border-color:inherit;
content:'';
transform:rotate(-45deg);
position:absolute;
top:1.26667em;
left:-1.2em;
width:.4em;
height:.4em;
z-index:1;
}
#indexlist.idx_design6 ol > li > span::before{
font-family:'Caveat',cursive;
font-size:1.33334em;
line-height:1.1;
}
/* 角丸の指定 */
#indexlist.idx_design6.idx_round{
border-radius:8px;
}
/* デザイン6（手書き） カラーバリエーション */
/* ブラック（デフォルト） */
#indexlist.idx_design6 .title{
color:#2f2f32;
}
#indexlist.idx_design6 li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(227,227,230)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6 ul > li > span::before{
border-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design6.red .title{
color:#c83535;
}
#indexlist.idx_design6.red li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(246,218,218)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.red ul > li > span::before{
border-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design6.orange .title{
color:#de7e1e;
}
#indexlist.idx_design6.orange li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(247,221,194)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.orange ul > li > span::before{
border-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design6.brown .title{
color:#958462;
}
#indexlist.idx_design6.brown li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(228,224,209)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.brown ul > li > span::before{
border-color:#958462;
}
/* イエロー */
#indexlist.idx_design6.yellow .title{
color:#e7cd08;
}
#indexlist.idx_design6.yellow li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(245,242,142)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.yellow ul > li > span::before{
border-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design6.green .title{
color:#38a05d;
}
#indexlist.idx_design6.green li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(206,236,225)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.green ul > li > span::before{
border-color:#38a05d;
}
/* シアン */
#indexlist.idx_design6.cyan .title{
color:#51bccb;
}
#indexlist.idx_design6.cyan li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(202,236,241)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.cyan ul > li > span::before{
border-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design6.blue .title{
color:#3877e5;
}
#indexlist.idx_design6.blue li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(211,227,252)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.blue ul > li > span::before{
border-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design6.navy .title{
color:#6269a2;
}
#indexlist.idx_design6.navy li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(226,227,233)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.navy ul > li > span::before{
border-color:#6269a2;
}
/* パープル */
#indexlist.idx_design6.purple .title{
color:#a260ad;
}
#indexlist.idx_design6.purple li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(241,222,244)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.purple ul > li > span::before{
border-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design6.pink .title{
color:#fba0ab;
}
#indexlist.idx_design6.pink li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(249,224,232)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.pink ul > li > span::before{
border-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design6.gray .title{
color:#aaaaab;
}
#indexlist.idx_design6.gray li span::after{
background-image:url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2211%22%20height%3D%221%22%3E%3Cpath%20fill%3D%22rgb(233,233,235)%22%20d%3D%22M.495%200h6v1h-6V0z%22%2F%3E%3C%2Fsvg%3E");
}
#indexlist.idx_design6.gray ul > li > span::before{
border-color:#aaaaab;
}
/* デザイン7（ガーリー）
==================================================
*/
#indexlist.idx_design7{
background-color:#fff;
border:2px solid #e6e6e8;
padding:2px;
}
#indexlist.idx_design7 #index_inner{
border:1px solid #e6e6e8;
padding:20px 32px;
text-align:center;
}
#indexlist.idx_design7 #index_inner > ul,#indexlist.idx_design7 #index_inner > ol{
border-top:2px dotted #e6e6e8;
padding-top:17px;
}
#indexlist.idx_design7 .title{
color:#565659;
font-family:'Yeseva One',cursive;
display:inline-block;
font-size:30px;
font-style:italic;
text-shadow:4px 4px 0 rgba(0,0,0,0.06);
padding:0 40px;
}
#indexlist.idx_design7 #index_button{
top:20px;
right:20px;
}
#indexlist.idx_design7 li a{
text-decoration:none;
}
#indexlist.idx_design7 li a:hover{
opacity:1;
text-decoration:underline;
}
#indexlist.idx_design7 ul > li{
padding:0 0 0 1.2em;
}
#indexlist.idx_design7 ul > li > span::before{
background-color:#2f2f32;
border-radius:1em;
content:'';
position:absolute;
left:.4em;
top:.6em;
width:.2em;
height:.2em;
z-index:1;
}
#indexlist.idx_design7 ol > li > span::before{
font-family:'Yeseva One',cursive;
}
/* 角丸の指定 */
#indexlist.idx_design7.idx_round{
border-radius:8px;
}
#indexlist.idx_design7.idx_round #index_inner{
border-radius:6px;
}
/* デザイン7（ガーリー） カラーバリエーション */
/* ブラック */
#indexlist.idx_design7{
border-color:#e6e6e8;
}
#indexlist.idx_design7 #index_inner{
border-color:#e6e6e8;
}
#indexlist.idx_design7 #index_inner > ul,#indexlist.idx_design7 #index_inner > ol{
border-top-color:#e6e6e8;
}
#indexlist.idx_design7 .title{
color:#565659;
}
#indexlist.idx_design7 ul > li > span::before{
background-color:#2f2f32;
}
/* レッド */
#indexlist.idx_design7.red{
border-color:#f7dddd;
}
#indexlist.idx_design7.red #index_inner{
border-color:#f7dddd;
}
#indexlist.idx_design7.red #index_inner > ul,#indexlist.idx_design7.red #index_inner > ol{
border-top-color:#f7dddd;
}
#indexlist.idx_design7.red .title{
color:#d25555;
}
#indexlist.idx_design7.red ul > li > span::before{
background-color:#c83535;
}
/* オレンジ */
#indexlist.idx_design7.orange{
border-color:#f8e0c7;
}
#indexlist.idx_design7.orange #index_inner{
border-color:#f8e0c7;
}
#indexlist.idx_design7.orange #index_inner > ul,#indexlist.idx_design7.orange #index_inner > ol{
border-top-color:#f8e0c7;
}
#indexlist.idx_design7.orange .title{
color:#e49441;
}
#indexlist.idx_design7.orange ul > li > span::before{
background-color:#de7e1e;
}
/* ブラウン */
#indexlist.idx_design7.brown{
border-color:#e7e3d5;
}
#indexlist.idx_design7.brown #index_inner{
border-color:#e7e3d5;
}
#indexlist.idx_design7.brown #index_inner > ul,#indexlist.idx_design7.brown #index_inner > ol{
border-top-color:#e7e3d5;
}
#indexlist.idx_design7.brown .title{
color:#aa9b7e;
}
#indexlist.idx_design7.brown ul > li > span::before{
background-color:#958462;
}
/* イエロー */
#indexlist.idx_design7.yellow{
border-color:#f6f397;
}
#indexlist.idx_design7.yellow #index_inner{
border-color:#f6f397;
}
#indexlist.idx_design7.yellow #index_inner > ul,#indexlist.idx_design7.yellow #index_inner > ol{
border-top-color:#f6f397;
}
#indexlist.idx_design7.yellow .title{
color:#ecd62f;
}
#indexlist.idx_design7.yellow ul > li > span::before{
background-color:#e7cd08;
}
/* グリーン */
#indexlist.idx_design7.green{
border-color:#d2eee4;
}
#indexlist.idx_design7.green #index_inner{
border-color:#d2eee4;
}
#indexlist.idx_design7.green #index_inner > ul,#indexlist.idx_design7.green #index_inner > ol{
border-top-color:#d2eee4;
}
#indexlist.idx_design7.green .title{
color:#55b378;
}
#indexlist.idx_design7.green ul > li > span::before{
background-color:#38a05d;
}
/* シアン */
#indexlist.idx_design7.cyan{
border-color:#cfeef2;
}
#indexlist.idx_design7.cyan #index_inner{
border-color:#cfeef2;
}
#indexlist.idx_design7.cyan #index_inner > ul,#indexlist.idx_design7.cyan #index_inner > ol{
border-top-color:#cfeef2;
}
#indexlist.idx_design7.cyan .title{
color:#69c9d6;
}
#indexlist.idx_design7.cyan ul > li > span::before{
background-color:#51bccb;
}
/* ブルー */
#indexlist.idx_design7.blue{
border-color:#d7e6fc;
}
#indexlist.idx_design7.blue #index_inner{
border-color:#d7e6fc;
}
#indexlist.idx_design7.blue #index_inner > ul,#indexlist.idx_design7.blue #index_inner > ol{
border-top-color:#d7e6fc;
}
#indexlist.idx_design7.blue .title{
color:#548dea;
}
#indexlist.idx_design7.blue ul > li > span::before{
background-color:#3877e5;
}
/* ネイビー */
#indexlist.idx_design7.navy{
border-color:#e5e6eb;
}
#indexlist.idx_design7.navy #index_inner{
border-color:#e5e6eb;
}
#indexlist.idx_design7.navy #index_inner > ul,#indexlist.idx_design7.navy #index_inner > ol{
border-top-color:#e5e6eb;
}
#indexlist.idx_design7.navy .title{
color:#7a80b5;
}
#indexlist.idx_design7.navy ul > li > span::before{
background-color:#6269a2;
}
/* パープル */
#indexlist.idx_design7.purple{
border-color:#f2e1f5;
}
#indexlist.idx_design7.purple #index_inner{
border-color:#f2e1f5;
}
#indexlist.idx_design7.purple #index_inner > ul,#indexlist.idx_design7.purple #index_inner > ol{
border-top-color:#f2e1f5;
}
#indexlist.idx_design7.purple .title{
color:#b577bd;
}
#indexlist.idx_design7.purple ul > li > span::before{
background-color:#a260ad;
}
/* ピンク */
#indexlist.idx_design7.pink{
border-color:#fae3ea;
}
#indexlist.idx_design7.pink #index_inner{
border-color:#fae3ea;
}
#indexlist.idx_design7.pink #index_inner > ul,#indexlist.idx_design7.pink #index_inner > ol{
border-top-color:#fae3ea;
}
#indexlist.idx_design7.pink .title{
color:#fcb0b9;
}
#indexlist.idx_design7.pink ul > li > span::before{
background-color:#fba0ab;
}
/* グレー */
#indexlist.idx_design7.gray{
border-color:#ebebed;
}
#indexlist.idx_design7.gray #index_inner{
border-color:#ebebed;
}
#indexlist.idx_design7.gray #index_inner > ul,#indexlist.idx_design7.gray #index_inner > ol{
border-top-color:#ebebed;
}
#indexlist.idx_design7.gray .title{
color:#bababb;
}
#indexlist.idx_design7.gray ul > li > span::before{
background-color:#aaaaab;
}