@charset "UTF-8" ;

body {
    /*
    font-family : "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
    */
    font-family : "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
    font-weight : normal ;
}

img {
    padding : 0px ;
    margin : 0px ;
    border : 0px ;
    vertical-align : middle ;
}
img[data-swap]:hover {
    cursor : pointer ;
}


h1.index,
h2.index,
div.description {
    width : 600px ;
    margin : 0px ;
    box-sizing : border-box ;
}


h1.index,
h2.index {
    color : #FFFFFF ;
    background-color : #2ED177 ;
    font-size : 16px ;
    font-weight : bold ;
    padding : 0px 10px ;
    display : table-cell ;
    vertical-align : middle ;
    height : 30px ;
}


h2.index {
    position : relative ;
    background : linear-gradient( 90deg, #2ED177 0px , #2ED177 200px, transparent 200px ) ;
    overflow : hidden ;
}
h2.index::before {
    position : absolute ;
    content : "" ;
    top : 0px ;
    left : 200px ;
    width : 0px ;
    height : 0px ;
    border-style : solid ;
    border-width : 30px ;
    border-color : transparent transparent transparent #2ED177 ;
}
h2::after {
    position : absolute ;
    content : "" ;
    bottom : 0px ;
    left : 200px ;
    width : 400px ;
    height : 3px ;
    background-color : #2ED177 ;
}

div.description {
    padding : 5px 10px ;
    margin-bottom : 15px ;
    font-size : 14px ;
}

div.description * {
    /*
    font-family : "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
    */
    font-family : "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
    font-weight : normal ;
    font-size : 14px;
}

div.description div, 
div.description table, 
div.description tr,
div.description td,
div.description ul,
div.description li {
    padding : 0px ;
    margin : 0px ;
    border : 0px ;
    box-sizing : border-box ;
}

div.description div.area_img {
    position : relative ;
    width : 562px ;
    height : 400px ;
    margin : 0px auto ;
    border-spacing : 0px ;
    /* background-color : green ; */
    display : flex ;
    /*left : -10px ;*/ /* 親divのpadding分をマイナス */
}
div.description div.area_img div {
    width : 70px ;
    height : 400px ;
    margin-left : 0px ;
    margin : 0px ;
    padding : 0px ;
}
div.description div.area_img div.img_main {
    width : 400px ;
    margin-left : 0px ;
    margin-right : 6px ;
    padding : 0px ;
    border : 0px ;
}
div.description div.area_img div[class^="thumb"] {
    display : flex ;
    flex-direction : column ;
    margin-left : 8px ;
    padding-top : 10px ;
}
div.description div.area_img div[class^="thumb"] img {
    border : 2px solid RGB(200,200,200) ;
    width : 66px ;
    height : 66px ;
    border-radius : 8px ;
    margin-bottom : 5px ;
}
div.description div.area_img div[class^="thumb"] img:last-child {
    margin-bottom : 0px ;
}
div.description div.area_img div[class^="thumb"] img.click {
    border-radius : 50% ;
    border-color : RGB(100, 100, 100) ;
}
div.description div.area_img div[class^="thumb"] img.mover {
    border-color : #FF0000 ;
    cursor : pointer ;
}

/*
旧バージョンの互換用
*/
div.description div.area_pic {
    position : relative ;
    width : 600px ;
    height : 396px ;
    left : -10px ; /* 親divのpadding分をマイナス */
}
div.description div.area_pic img.large {
    position : absolute ;
    top : 0px ;
    left : 2px ;
}
div.description div.area_pic img.small_up {
    position : absolute ;
    top : 0px ;
    right : 2px ;
}
div.description div.area_pic img.small_down {
    position : absolute ;
    bottom : 0px ;
    right : 2px ;
}
/*
互換用 終了
*/

div.description div.area_button {
    position : relative ;
    width : 600px ;
    left : -10px ; /* 親divのpadding分をマイナス */
    padding-left : 4px ;
    margin-top : 8px ;
    font-size : 0px ;
}
div.description div.area_button div {
    position : relative ;
    display : inline-block ;
    width : 148px ;
    height : 32px ;
    margin-bottom : 10px ;
    background-image : url( "../image/common/bttn_def.gif" ) ;
}
div.description div.area_button div:hover {
    background-image : url( "../image/common/bttn_over.gif" ) ;
}
div.description div.area_button div:nth-child(5) {
    /*margin-top : 10px ;*/
    margin-right : 296px ;
}
div.description div.area_button div a {
    position : absolute ;
    width : 100% ;
    height : 100% ;
    text-align : center ;
    text-decoration : none ;
    color : #000000 ;
    padding-top : 8px ;
}
div.description div.area_button div a:hover {
    color : #FF0000 ;
    /*font-weight : bold ;*/
}




div.description table {
    border-collapse : separate ;
    border-spacing : 2px ;
}

div.description table {
    position : relative ;
    left : -10px ; /* 親divのpadding分をマイナス */
    width : 600px ;
    border-spacing : 2px ;
}

div.description table th {
    text-align : center ;
    width : 100px ;
    height : 30px ;
    background-color : #CCCCCC ;
    white-space : nowrap ;
    vertical-align : middle ;
    font-weight : normal ;
}

div.description table td {
    padding-left : 10px ;
    text-align : left ;
    width : auto ;
    height : 30px ;
    background-color : #E6E6E6 ;
}

div.description table.kanren td {
    text-align : left ;
    width : 50% ;
}

div.description table.kounyu th,
div.description table.kounyu td {
    text-align : center ;
    background-color : #E6E6E6 ;
    padding : 0px ;
    margin : 0px ;
}
div.description table.kounyu th:nth-child(1) {
    width : auto ;
}
div.description table.kounyu th:nth-child(2),
div.description table.kounyu th:nth-child(6) {
    width : 60px ;
}
div.description table.kounyu th:nth-child(3),
div.description table.kounyu th:nth-child(4) {
    width : 75px ;
}
div.description table.kounyu th:nth-child(5) {
    width : 130px ;
}
div.description table.kounyu th:nth-child(7) {
    width : 90px ;
}
div.description table.kounyu th:nth-child(4),
div.description table.kounyu td:nth-child(4) {
    background-color : #FFCCFF ;
}
div.description table.kounyu td:nth-child(1) {
    text-align : right ;
    padding-right : 10px ;
}
div.descritpion table.kounyu select,
div.description table.kounyu input[type="button"] {
    padding : 0px ;
    margin : 0px ;
    box-sizing : border-box ;
    height : 22px ;
}
div.description table.kounyu select {
    width : 120px ;
    text-align : center ;
}
div.description table.kounyu select.num {
    width : 50px ;
    text-align : center ;
}
div.description table.kounyu input[type="button"] {
    width : 80px ;
    text-align : center ;
}

div.description table.souryou th:nth-child(1) {
    width : 100px ;
}
div.description table.souryou th:nth-child(2) {
    width : auto ;
}
div.description table.souryou th:nth-child(3) {
    width : 150px ;
}
div.description table.souryou td {
    text-align : center ;
}
div.description table.souryou td:nth-child(2) {
    text-align : left ;
}


div.description ul {
    list-style-type : none ;
    line-height : 28px ;
}
div.description li {
    padding-left : 1em ;  /* 改行時の頭を揃える */
    text-indent : -1em ;  /* 改行時の頭を揃える */
}

div.description li::before {
    content : "●" ;
    font-size : 10px ;
    margin-left : 2px ;
    margin-right : 2px ;
}

div.description li.notice::before {
    content : "※" ;
    font-size : 14px ;
    margin : 0px ;
}


div.return {
    position : relative ;
    right : -10px ; /* 親divのpadding分をマイナス */
    line-height : 15px ;
    text-align  : right ;
}
div.return * {
    font-size : 12px ;
}


.font_12px {
    font-size : 12px ;
}