@media only screen and (min-width:600px) {

.event-title {
    font-size: 180%;
    color: #202321;
    font-weight: normal;
    padding: 22px 10px;
    margin: 0 0 60px;
    line-height: 1;
    border-bottom: #CCC 1px solid;
}

img {
    max-width: 100%;
    vertical-align: top;
}

section a {
    display: block;
    text-decoration: none;
    text-align: center;
    color: #333;
}

section ul {
    margin: 0;
    padding: 0;
}

section li {
    list-style: none;
}

section p {
    margin: 0;
}

hr {
    margin: 80px 50px;
    border-top: 1px solid #333;
    border-bottom: none;
}

section h1 {
    margin: 0;
    padding: 60px 0 0;
    font-size: 300%;
    font-weight: 600;
    text-align: center;
    border-bottom: none;
}

section h2 {
    margin: 0 0 20px;
    text-align: center;
    font-size: 200%;
    font-weight: 600;
}

section h3 {
    margin-bottom: 20px;
    text-align: center;
    font-size: 200%;
    font-weight: 600;
    border-bottom: none;
}

.side-color-red {
    border-left: 16px solid #cc0000;
    border-right: 16px solid #cc0000;
    margin-bottom: 50px;
}

.side-color-orange {
    border-left: 16px solid #f79c34;
    border-right: 16px solid #f79c34;
}

.side-color-grey {
    border-left: 16px solid #e8e8e8;
    border-right: 16px solid #e8e8e8;
}

.wrap-contents {
    padding: 150px 0 0;
    margin-top: -150px;
}

.can-use {
    margin-bottom: 50px;
    text-align: center;
    font-size: 180%;
    font-weight: 600;
}

.underline {
    position: relative;
    display: inline;
    padding-bottom: 10px;
    border-bottom: 10px solid #cc0000;
}

.underline:after {
    position: absolute;
    content: '';
    top: 120%;
    left: 43%;
    border: 10px solid transparent;
    border-top: 12px solid #cc0000;
    width: 0;
    height: 0;
}


.index {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.index li {
    width: 25%;
    margin-bottom: 25px;
}

.index img {
    display: block;
}

/* au */

.wrap-about-contents {
    padding: 0 50px;
}

.main-text {
    font-size: 150%;
    font-weight: 600;
}

.details-btn a {
    display: block;
    margin: 50px;
    padding: 15px 0;
    font-size: 150%;
    text-align: center;
    color: #fff;
    background-color: #333;
    border-radius: 6px;
}

/* docomo */

.flex-docomo {
    display: flex;
    justify-content: center;
    gap: 80px;
}

.flex-docomo {
    margin: 50px 0;
    text-align: center;
}

.d-point-text {
    font-size: 120%;
    font-weight: 600;
}

.note {
    margin-top: 25px;
    padding-left: 1em;
    text-indent: -1em;
}


.wrap-title {
    text-align: center;
}

.wrap-title h2 {
    display: inline;
    padding: 15px 30px;
    border: 3px solid #333;
}

.flex-how {
    display: flex;
    justify-content: center;
    margin: 80px 0;
    gap: 30px;
}

.flex-how img {
    width: 48%;
}

/* btn */

.right-arrow  {
    display: block;
    position: relative;
    margin: 50px;
    padding: 20px;
    font-size: 120%;
    text-align: center;
    background: #333;
    color: #fff;
}

.right-arrow::after {
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    top: 50%;
    right: 30px;
    content: '';
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: translateY(-50%) rotate(45deg);
}
}