@charset "UTF-8";

h2.cmp-title__text {
    margin-bottom: 0;
}

.SupportedBrandArea {
    display: flex;
    justify-content: flex-end;
}

.SupportedBrand {
    font-size: 0;
}

.SupportedBrand>span {
    display: inline-block;
    width: 85px;
    text-align: center;
}

.SupportedBrand img {
    width: 50px;
    height: auto;
}

.ServiceDetail {
    overflow: hidden;
    position: relative;
    padding: 20px 0;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
}

.ServiceDetail+.ServiceDetail {
    border-top: none;
}

.ServiceDetail ul {
    padding: 0;
}

.ServiceDetail li {
    margin-top: 8px;
    line-height: 1.5;
    font-size: 12px;
    padding-left: 1.3em;
    text-indent: -1.3em;
    list-style-type: none;
}

.ServiceDetail .Note li {
    color: #707070;
}

.ServiceDetail .List li:before {
    content: "・";
}

.ServiceDetail .Note li:before {
    content: "※ ";
    font-size: 12px;
}

.ServiceCategory:last-child .ServiceDetail:last-child {
    border-bottom: none;
}


.ServiceName {
    float: left;
    clear: right;
    font-weight: bold;
    width: 315px;
}

.ServiceName a {
    background: rgba(0, 0, 0, 0);
    color: #574D32;
    border: none;
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    text-align: left;
    vertical-align: middle;
    position: relative;
}

.ServiceName a:hover {
    color: #574D32;
    opacity: 0.5;
}

.ServiceName a:after {
    content: " ";
    margin-left: 8px;
    width: 1.0em;
    height: 1.0em;
    display: inline-block;
    vertical-align: -2px;
}

.ServiceName a[target="_self"]:after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.b%7Bstroke:%23574D32;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='16' height='16'/%3E%3Cpath class='b' d='M4.55,1.1l5,5-5,5' transform='translate(1.449 1.898)'/%3E%3C/svg%3E")no-repeat;
    background-size: contain;
}

.ServiceName a[target="_blank"]:after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a,.b,.c%7Bfill:none;%7D.b,.c%7Bstroke:%23574D32;stroke-linecap:round;stroke-width:2px;%7D.b%7Bstroke-linejoin:round;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='16' height='16'/%3E%3Cg transform='translate(2.455 2.455)'%3E%3Cpath class='b' d='M12.086,9.711v2.376H1V1H3.376' transform='translate(-1 -1)'/%3E%3Cpath class='b' d='M9,1h4.751V5.752' transform='translate(-2.665 -1)'/%3E%3Cpath class='c' d='M5,1,0,6' transform='translate(5.543 -0.457)'/%3E%3C/g%3E%3C/svg%3E")no-repeat;
    background-size: contain;
}

.ServiceName a[target="_WinPop"]:after {
    background: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cdefs%3E%3Cstyle%3E.a,.b,.c%7Bfill:none;%7D.b,.c%7Bstroke:%23574D32;stroke-linejoin:round;stroke-width:2px;%7D.c%7Bstroke-linecap:round;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='16' height='16'/%3E%3Cg transform='translate(2.355 2)'%3E%3Cpath class='b' d='M9,7.088V9H1V1H2.914' transform='translate(-1 2.641)'/%3E%3Crect class='c' width='8' height='8' transform='translate(3.644)'/%3E%3C/g%3E%3C/svg%3E")no-repeat;
    background-size: contain;
}

.ServiceName .Note {
    font-weight: normal;
}

.SupportedCard {
    clear: left;
    float: left;
    margin-top: 5px;
}

.IconPlatinum {
    display: inline-block;
    padding: 1px;
    background: #222222;
    color: #ffffff;
    width: 60px;
    font-size: 13px;
    text-align: center;
    padding-top: 2px;
    line-height: 26px;
}

.IconGold {
    display: inline-block;
    padding: 1px;
    background: #967d56;
    color: #ffffff;
    text-align: center;
    width: 60px;
    font-size: 13px;
    padding-top: 2px;
    line-height: 26px;
}

.IconGoldPlus {
    display: inline-block;
    padding: 1px;
    background: #6b778d;
    color: #ffffff;
    text-align: center;
    width: 60px;
    font-size: 13px;
    padding-top: 2px;
    line-height: 26px;
}

.ServiceDescription {
    margin-top: 0;
    padding: 0 180px 0 330px;
}

div[class^="contShowHide brand_ana"] .ServiceDescription,
div[class*=" contShowHide brand_ana "] .ServiceDescription {
    padding-right: 0;
}

.ServiceDescription p+p {
    margin-top: 5px;
}

.SupportedBrandChecker {
    width: 170px;
    margin-top: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}

/* AEMエディターでの対象コンテンツ非表示 */
div[class^="contShowHide brand_ana"] .SupportedBrandChecker,
div[class*=" contShowHide brand_ana "] .SupportedBrandChecker {
    display: none;
}

.SupportedBrandChecker div.SupportedBrandVisa {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 50%;
    text-align: center;
}

.SupportedBrandChecker div.SupportedBrandMaster {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 50%;
    text-align: center;
}

.SupportedBrandChecker .IconCheckActive {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-top: -7.5px;
    margin-left: -10px;
}

.cmp-includejsp:has(.ExplanatoryNotes) {
    width: 100vw;
    margin-bottom: 80px;
}

.ExplanatoryNotes {
    background: #ebebeb;
    width: 100%;
    font-size: 11px;
    margin-left: calc((960px - 100vw) / 2);
    border-left: solid calc((-960px + 100vw) / 2) #ebebeb;
    border-right: solid calc((-960px + 100vw) / 2) #ebebeb;
}

.ExplanatoryNotes .InnerWrap {
    padding: 10px 40px;
    white-space: nowrap;
}

.ExplanatoryNotes dl>* {
    display: inline-block;
    margin-right: 8px;
}

.ExplanatoryNotes dl dt {
    font-weight: normal;
    margin-top: 0;
}

/*提携カード用スタイル*/
.PlatinumServices.Hilton .ServiceDescription,
.PlatinumServices.Ana .ServiceDescription {
    padding: 0 0 0 330px;
}


@media print {

    /*印刷用CSSの定義を指定する*/
    .ActionStickyHeader.ActionCloned.Active {
        display: none;
    }

}

@media (max-width: 960px) {
    .ExplanatoryNotes {
        margin-left: 0;
        width: 960px;
    }
}

@media (max-width: 640px) {

    .ExplanatoryNotes .InnerWrap {
        min-width: none;
        padding: 0 10px;
    }

    .SupportedBrand {
        width: 35%;
    }

    .SupportedBrand>span {
        width: 50%;
        padding: 5px;
        text-align: center;
    }

    .SupportedBrand img {
        width: 100%;
        max-width: 50px;
        height: auto;
    }

    .ServiceDetail+.ServiceDetail {
        border-top: none;
    }

    .ServiceName {
        float: none;
        padding-right: 35%;
        width: auto;
    }

    
    div[class^="contShowHide brand_ana"] .ServiceName,
    div[class*=" contShowHide brand_ana "] .ServiceName {
        padding-right: 0;
    }

    .SupportedCard {
        float: none;
        padding-right: 35%;
        margin-bottom: 10px;
    }

    .ServiceDescription {
        padding: 0;
    }

    .SupportedBrandChecker {
        top: 0;
        right: 0;
        width: 35%;
    }

    .SupportedBrandChecker .IconCheckActive {
        margin-top: 20px;
        position: relative;
        top: 10px;
        bottom: 0px;
    }

    .ExplanatoryNotes {
        background: #ebebeb;
        height: 100px;
        padding: 4px 0;
        line-height: 26px;
    }

    .ServiceDetail ul {
        margin: 0;
    }

    .ExplanatoryNotes dl {
        font-weight: normal;
        padding-right: 35px;
        padding-left: 53px;
        margin-top: -1px;
    }

    .ExplanatoryNotes dl>* {
        float: left;
        margin: 0;
    }

    .ExplanatoryNotes dl dd {
       margin-left: 8px;
        margin-top: 4px;
    }

    .ExplanatoryNotes dl dt {
        font-weight: normal;
        clear: left;
        margin-left: -52px;
        margin-top: 2px;
    }

    .ExplanatoryNotes .IconPlatinum,
    .ExplanatoryNotes .IconGold,
    .ExplanatoryNotes .IconGoldPlus {
        width: 60px;
    }

    /*提携カード用スタイル*/
    .PlatinumServices.Hilton .ServiceDescription,
    .PlatinumServices.Ana .ServiceDescription {
        padding: 0;
    }

    .PlatinumServices.Hilton .ServiceName,
    .PlatinumServices.Ana .ServiceName {
        padding: 0;
    }
}