@charset "utf-8";

/*------------------------------------------------------------
[SP]
------------------------------------------------------------ */
#suntory_contents .sp_item.inline_item {
	display: inline-block;
}
#suntory_contents .pc_item {
	display: none;
}


/*------------------------------------------------------------
Adjustments for legacy settings
------------------------------------------------------------ */
#suntory_contents .philosophy_contents {
/*	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
font-feature-settings: "palt";
	letter-spacing: 0.05em;*/
/* font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; */
	color: #000;
}

/* #suntory_contents .philosophy_contents h1,
#suntory_contents .philosophy_contents h2,
#suntory_contents .philosophy_contents h3,
#suntory_contents .philosophy_contents h4,
#suntory_contents .philosophy_contents h5,
#suntory_contents .philosophy_contents h6,
#suntory_contents .philosophy_contents p,
#suntory_contents .philosophy_contents br,
#suntory_contents .philosophy_contents ul,
#suntory_contents .philosophy_contents ol,
#suntory_contents .philosophy_contents li,
#suntory_contents .philosophy_contents dl,
#suntory_contents .philosophy_contents dt,
#suntory_contents .philosophy_contents dd,
#suntory_contents .philosophy_contents from,
#suntory_contents .philosophy_contents table,
#suntory_contents .philosophy_contents th,
#suntory_contents .philosophy_contents td,
#suntory_contents .philosophy_contents input,
#suntory_contents .philosophy_contents select,
#suntory_contents .philosophy_contents article,
#suntory_contents .philosophy_contents aside,
#suntory_contents .philosophy_contents details,
#suntory_contents .philosophy_contents figcaption,
#suntory_contents .philosophy_contents figure,
#suntory_contents .philosophy_contents footer,
#suntory_contents .philosophy_contents header,
#suntory_contents .philosophy_contents hgroup,
#suntory_contents .philosophy_contents menu,
#suntory_contents .philosophy_contents nav,
#suntory_contents .philosophy_contents section {
	font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
} */


/*------------------------------------------------------------
[SP]section
------------------------------------------------------------ */
#suntory_contents .section#section01 {
    margin-bottom: 25.333333333333333vw;
    padding-top: 13.333333333333333vw;
    position: relative;
}
#suntory_contents .section#section02 {
    margin-bottom: 26.666666666666667vw;
}
#suntory_contents .section#section03 {
    margin-bottom: 26.666666666666667vw;
}
#suntory_contents .section#section01::after {
    content: '';
    width: 80vw;
    height: 9.6vw;
    background: url(../svg/arrowhead.svg) no-repeat center 0;
    background-size: auto 9.6vw;
    position: absolute;
    bottom: -17.6vw;
    left: calc(50% - 40vw);
}
#suntory_contents .section h2 {
    margin-bottom: 8vw;
    font-size: 6.4vw;
    font-weight: bold;
    text-align: center;
    color: #000;
}
#suntory_contents .section .text {
    margin: 0 5.333333333333333vw 8vw;
    font-size: 4.266666666666667vw;
    line-height: 1.6875;
    text-align: center;
}

/*------------------------------------------------------------
[SP]philosophy_list
------------------------------------------------------------ */
#suntory_contents .philosophy_list {
    margin: 0 5.333333333333333vw 0;
    padding: 0;
    border: 2.133333333333333vw #5BC2DC solid;
}
#suntory_contents .philosophy_list dt {
    margin: 0;
    padding: 8vw 2vw 5.333333333333333vw;
    background: #DFF1F7;
}
#suntory_contents .philosophy_list dd + dt {
    border-top: 2.133333333333333vw #5BC2DC solid;
}
#suntory_contents .philosophy_list dt h3 {
    margin: 0 0 2.666666666666667vw;
    font-size: 4.8vw;
    font-weight: bold;
    text-align: center;
    color: #000;
    border: none;
    padding: 0;
    background: none;
}
#suntory_contents .philosophy_list dt p {
    margin: 0;
    padding: 0;
    font-size: 4.266666666666667vw;
    text-align: center;
}
#suntory_contents .philosophy_list dd {
    margin: 0;
    padding: 8vw 2vw;
}
#suntory_contents .philosophy_list dd p {
    margin: 0;
    font-size: 4.8vw;
    line-height: 2;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .philosophy_list dd .values {
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-flex;
    flex-direction: column;
}
#suntory_contents .philosophy_list dd .values li + li {
    margin: 8vw 0 0;
}
#suntory_contents .philosophy_list dd .values h4 {
    margin: 0 0 5.333333333333333vw;
    font-size: 6.4vw;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .philosophy_list dd .values p {
    margin: 0 2.666666666666667vw;
    font-size: 4.266666666666667vw;
    font-weight: normal;
    line-height: 1.6875;
    text-align: center;
}

/*------------------------------------------------------------
[SP]message
------------------------------------------------------------ */
#suntory_contents .message {
    margin: 0 5.333333333333333vw 0;
    padding: 10.666666666666667vw 0;
    border: 2.133333333333333vw #5BC2DC solid;;
}
#suntory_contents .message dt {
    margin:0 auto 8vw;
    width: 53.333333333333333vw;
    height: 14.4vw;
    background: url(../svg/message.svg) no-repeat 0 0;
    background-size: 53.333333333333333vw auto;
    text-indent: -99999px;
}
#suntory_contents .message dd {
    margin: 0 5.333333333333333vw;
    padding: 0;
    font-size: 3.733333333333333vw;
    line-height: 1.8;
}

/*------------------------------------------------------------
[SP]related_contents
------------------------------------------------------------ */
#suntory_contents .related_contents {
    margin: 0 5.333333333333333vw 2.666666666666667vw;
    padding: 0 0 0;
    background: #9DDAEA;
}
#suntory_contents .related_contents .related_header {
    padding: 8vw 12.8vw 8vw 4vw;
}
#suntory_contents .related_contents .related_header h3 {
    margin: 0 0 5.333333333333333vw;
    font-size: 6.4vw;
    font-weight: bold;
    line-height: 1.25;
    border: none;
    color: #000;
}
#suntory_contents .related_contents .related_header p {
    margin: 0;
    font-size: 4.266666666666667vw;
    line-height: 1.6875;
}
#suntory_contents .related_contents .trigger {
    padding: 8vw 12.8vw 8vw 4vw;
    background: url(../svg/icon_plus.svg) no-repeat right 4vw center;
    background-size: 5.333333333333333vw auto;
    cursor: pointer;
}
#suntory_contents .related_contents.open .trigger {
    background: url(../svg/icon_minus.svg) no-repeat right 4vw center;
    background-size: 5.333333333333333vw auto;
}
#suntory_contents .related_contents .related_link {
    padding: 8vw 12.8vw 8vw 4vw;
    background: url(../svg/icon_link.svg) no-repeat right 4vw center;
    background-size: 3.2vw auto;
}
#suntory_contents .related_contents .related_link a {
    text-decoration: none;
    color: #000;
    display: block;
}
#suntory_contents .related_contents .related_link h3 {
    margin: 0 0 5.333333333333333vw;
    font-size: 6.4vw;
    font-weight: bold;
    line-height: 1.25;
    border: none;
    color: #000;
}
#suntory_contents .related_contents .related_header h3,
#suntory_contents .related_contents .related_link h3 {
    padding:0 0 0 2.133vw;
}
#suntory_contents .related_contents .related_link p {
    margin: 0;
    font-size: 4.266666666666667vw;
    line-height: 1.6875;
}
#suntory_contents .related_body {
    display: none;
}
#suntory_contents .related_contents.open .related_body {
    display: block;
    padding-bottom: 4vw;
}
#suntory_contents .related_contents .related_list {
    margin: 0 4vw 0;
    padding: 0;
    list-style: none;
}
#suntory_contents .related_contents .related_list li {
    margin: 0;
    padding: 8vw 4vw;
    background: #fff;
}
#suntory_contents .related_contents .related_list li + li {
    margin: 2.666666666666667vw 0 0;
}
#suntory_contents .related_contents .related_list li h4 {
    margin: 0 0 5.333333333333333vw;
    font-size: 6.4vw;
    line-height: 1.25;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .related_contents .related_list li p {
    margin: 0;
    font-size: 4.266666666666667vw;
    line-height: 1.6875;
}
#suntory_contents .related_contents .credo {
    margin: 0 4vw;
    padding: 8vw 4vw;
    background: #fff;
}
#suntory_contents .related_contents .credo dt {
    margin: 0 0 8vw;
    font-size: 6.4vw;
    line-height: 1;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .related_contents .credo dd {
    margin: 0;
    padding: 0;
}
#suntory_contents .related_contents .credo dd p {
    margin: 0;
    font-size: 4.266666666666667vw;
    line-height: 1.6875;
    text-align: center;
}
#suntory_contents .related_contents .credo dd p + p {
    margin: 8vw 0 0;
}

/*------------------------------------------------------------
[SP]philosophy_link
------------------------------------------------------------ */
#suntory_contents .section#section04 {
    margin-bottom: 24vw;
}

#suntory_contents .philosophy_link {
    margin: 0 5.333333333333333vw 2.666666666666667vw;
}

#suntory_contents .philosophy_link + .philosophy_link {
    margin-top: 21.333vw;
}

#suntory_contents .philosophy_link_img img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}

#suntory_contents .philosophy_link dl {
    margin: 0;
}

#suntory_contents .philosophy_link_text {
    margin-top: 4.8vw;
}

#suntory_contents .philosophy_link_ttl {
    font-size: 6.4vw;
    line-height: 1.25;
    font-weight: bold;
}

#suntory_contents .philosophy_link_detail {
    margin: 5.333vw 0 0;
    font-size: 4.267vw;
    line-height: 1.8125;
}

#suntory_contents .philosophy_link_btn {
    margin-top: 6.933vw;
}

#suntory_contents .philosophy_link_btn a {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 4vw;
    font-weight: bold;
    width: 58.667vw;
    height:13.333vw;
    background-color: #fff;
    border: 0.267vw solid #707070;
    color: #000;
    border-radius: 9999vw;
    transition: all .2s ease-in-out;
}

#suntory_contents .philosophy_link_btn a:hover {
    background-color: #9DDAEA;
	border: 1px solid #5BC2DC;
	text-decoration: none;
}

#suntory_contents .philosophy_link_btn a::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 4.8vw;
    display: block;
    width: 2.133vw;
    height: 2.133vw;
    border-top: 0.267vw solid #000;
    border-right: 0.267vw solid #000;
    border-radius: 0.267vw;
    transform: translate(0, -50%) rotate(45deg);
}

/*------------------------------------------------------------
[SP]btn_ccb
------------------------------------------------------------ */
#suntory_contents .btn_ccb a {
    margin: 0 auto;
    width: 89.333333333333333vw;
    height: 13.333333333333333vw;
    border: 0.266666666666667vw #707070 solid;
    background: url(../svg/icon_link.svg) no-repeat right 4vw center;
    background-size: 2.133333333333333vw auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4vw;
    font-weight: bold;
    text-decoration: none;
    color: #000;
    border-radius: 6.666666666666667vw;
}

/*------------------------------------------------------------
[SP]page_top
------------------------------------------------------------ */
#suntory_contents .page_top {
    margin: 0;
    width: 100vw;
    height: 13.333333333333333vw;
    display: none;
}
#suntory_contents .page_top.active {
    display: block;
}
#suntory_contents .page_top.fixed {
    position: fixed;
    right: 0;
    bottom: 8vw;
}
#suntory_contents .btn_pate_top a {
    display: block;
    width: 13.333333333333333vw;
    height: 13.333333333333333vw;
    border-radius: 50%;
    background: #EDF4F7 url(../svg/icon_page_top.svg) no-repeat center center;
    background-size: 2.666666666666667vw auto;
    text-decoration: none;
    text-indent: -99999px;
    position: absolute;
    right: 5.333333333333333vw;
}

/*------------------------------------------------------------
[PC]
------------------------------------------------------------ */
@media print, screen and (min-width:768px) {

#suntory_contents .sp_item.inline_item {
    display: none;
}
#suntory_contents .sp_item {
    display: none;
}
#suntory_contents .pc_item {
    display: block;
}
#suntory_contents .pc_item.inline_item {
	display: inline-block;
}

#suntory_contents #container,
#suntory_contents .philosophy_contents {
    max-width: 1164px;
    width: 100%;
    margin: 0 auto;
}

/*------------------------------------------------------------
[PC]section
------------------------------------------------------------ */
#suntory_contents .section#section01 {
    margin-bottom: 110px;
    padding-top: 60px;
    position: relative;
}
#suntory_contents .section#section02 {
    margin-bottom: 120px;
}
#suntory_contents .section#section03 {
    margin-bottom: 120px;
}
#suntory_contents .section#section01::after {
    content: '';
    width: 400px;
    height: 50px;
    background: url(../svg/arrowhead.svg) no-repeat center 0;
    background-size: auto 50px;
    position: absolute;
    bottom: -80px;
    left: calc(50% - 200px);
}
#suntory_contents .section h2 {
    margin-bottom: 30px;
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
}
#suntory_contents .section#section01 h2 {
    font-size: 36px;
}
#suntory_contents .section .text {
    margin: 0 0 30px;
    font-size: 18px;
    line-height: 1.6875;
    text-align: center;
}

/*------------------------------------------------------------
[PC]philosophy_list
------------------------------------------------------------ */
#suntory_contents .philosophy_list {
    max-width: 1164px;
    margin: 0 auto;
    padding: 0;
    border: 10px #5BC2DC solid;
}
#suntory_contents .philosophy_list dt {
    margin: 0;
    padding: 15px 30px;
    background: #DFF1F7;
    display: flex;
    align-items: center;
}
#suntory_contents .philosophy_list dd + dt {
    border-top: 10px #5BC2DC solid;
}
#suntory_contents .philosophy_list dt h3 {
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    text-align: left;
    width: 180px;
}
#suntory_contents .philosophy_list dt p {
    margin: 0;
    font-size: 18px;
    text-align: left;
}
#suntory_contents .philosophy_list dd {
    margin: 0;
    padding: 25px 20px;
    text-align: center;
}
#suntory_contents .philosophy_list dd p {
    margin: 0;
    font-size: 30px;
    line-height: 1.8;
    letter-spacing: 0;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .philosophy_list dd .values {
    list-style: none;
    margin: 0 auto;
    padding: 0;
}
#suntory_contents .philosophy_list dd .values li + li {
    margin: 30px 0 0;
}
#suntory_contents .philosophy_list dd .values li {
    display: flex;
    align-items: center;
}
#suntory_contents .philosophy_list dd .values h4 {
    margin: 0;
    width: 390px;
    font-size: 30px;
    line-height: 1.25;
    font-weight: bold;
    text-align: left;
}
#suntory_contents .philosophy_list dd .values p {
    margin: 0;
    width: calc(100% - 390px);;
    font-size: 18px;
    font-weight: normal;
    line-height: 1.6875;
    text-align: left;
}

/*------------------------------------------------------------
[PC]message
------------------------------------------------------------ */
#suntory_contents .message {
    margin: 0 auto;
    max-width: 1164px;
    width: 100%;
    padding: 20px 40px;
    border: 10px #5BC2DC solid;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
}
#suntory_contents .message dt {
    margin:0;
    width: 354px;
    height: 74px;
    background: url(../svg/message.svg) no-repeat 0 0;
    background-size: 279px auto;
    text-indent: -99999px;
}
#suntory_contents .message dd {
    margin: 0;
    padding: 0;
    width: calc(100% - 354px);;
    font-size: 16px;
    line-height: 1.8;
}

/*------------------------------------------------------------
[PC]related_contents
------------------------------------------------------------ */
#suntory_contents .related_contents {
    max-width: 1164px;
    width: 100%;
    margin: 0 auto 10px;
    padding: 0;
    background: #9DDAEA;
}
#suntory_contents .related_contents .related_header {
    padding: 30px 90px 30px 30px;
}
#suntory_contents .related_contents .related_header h3 {
    margin: 0 0 20px;
    padding: 0;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.25;
}
#suntory_contents .related_contents .related_header:hover h3 {
    text-decoration: underline;
}
#suntory_contents .related_contents .related_header p {
    margin: 0;
    font-size: 18px;
    line-height: 1.6875;
}
#suntory_contents .related_contents .trigger {
    padding: 30px 90px 30px 30px;
    background: url(../svg/icon_plus.svg) no-repeat right 30px center;
    background-size: 20px auto;
    cursor: pointer;
}
#suntory_contents .related_contents.open .trigger {
    background: url(../svg/icon_minus.svg) no-repeat right 30px center;
    background-size: 20px auto;
}
#suntory_contents .related_contents .related_link {
    padding: 30px 90px 30px 30px;
    background: url(../svg/icon_link.svg) no-repeat right 30px center;
    background-size: 12px auto;
}
#suntory_contents .related_contents .related_link a {
    text-decoration: none;
    color: #000;
    display: block;
}
#suntory_contents .related_contents .related_link h3 {
    margin: 0 0 20px;
    padding: 0;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.25;
}
#suntory_contents .related_contents .related_link:hover h3 {
    text-decoration: underline;
}


#suntory_contents .related_contents .related_link p {
    margin: 0;
    font-size: 18px;
    line-height: 1.6875;
}
#suntory_contents .related_body {
    display: none;
}
#suntory_contents .related_contents.open .related_body {
    display: block;
    padding-bottom: 30px;
}

#suntory_contents .related_contents .related_list {
    margin: 0 30px 0;
    padding: 0;
    list-style: none;
}
#suntory_contents .related_contents .related_list li {
    margin: 0;
    padding: 30px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#suntory_contents .related_contents .related_list li + li {
    margin: 10px 0 0;
}
#suntory_contents .related_contents .related_list li h4 {
    width: 360px;
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    text-align: left;
}
#suntory_contents .related_contents .related_list li p {
    margin: 0;
    width: 714px;
    font-size: 16px;
    line-height: 1.6875;
}
#suntory_contents .related_contents .credo {
    margin: 0 30px;
    padding: 30px;
    background: #fff;
}
#suntory_contents .related_contents .credo dt {
    margin: 0 0 20px;
    font-size: 24px;
    line-height: 1;
    font-weight: bold;
    text-align: center;
}
#suntory_contents .related_contents .credo dd {
    margin: 0;
    padding: 0;
}
#suntory_contents .related_contents .credo dd p {
    margin: 0;
    font-size: 18px;
    line-height: 1.6875;
    text-align: center;
}
#suntory_contents .related_contents .credo dd p + p {
    margin: 20px 0 0;
}

/*------------------------------------------------------------
[SP]philosophy_link
------------------------------------------------------------ */
#suntory_contents .section#section04 {
    margin-bottom: 160px;
}

#suntory_contents .philosophy_link {
    margin: 0;
    display: flex;
    justify-content: space-between;
}

#suntory_contents .philosophy_link + .philosophy_link {
    margin-top: 100px;
}

#suntory_contents .philosophy_link:nth-child(odd) {
    flex-direction: row-reverse;
}

#suntory_contents .philosophy_link_img,
#suntory_contents .philosophy_link_text {
    width: 48.5%;
}

#suntory_contents .philosophy_link_text {
    margin-top: 0;
}

#suntory_contents .philosophy_link_ttl {
    font-size: 28px;
    line-height: 1.214;
}

#suntory_contents .philosophy_link_detail {
    margin: 30px 0 0;
    font-size: 16px;
    line-height: 1.8125;
}

#suntory_contents .philosophy_link_btn {
    margin-top: 26px;
}

#suntory_contents .philosophy_link_btn a {
    font-size: 15px;
    width: 220px;
    height: 50px;
    border: 1px solid #707070;
}

#suntory_contents .philosophy_link_btn a::after {
    right: 15px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    border-radius: 1px;
    transform: translate(0, -50%) rotate(45deg);
}


/*------------------------------------------------------------
[PC]btn_ccb
------------------------------------------------------------ */
#suntory_contents .btn_ccb a {
    margin: 0 auto;
    width: 350px;
    height: 50px;
    border: 1px #707070 solid;
    background: url(../svg/icon_link.svg) no-repeat right 15px center;
    background-size: 8px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    color: #000;
    border-radius: 25px;
}
#suntory_contents .btn_ccb a:hover {
    border: 1px #5BC2DC solid;
    background: #9DDAEA url(../svg/icon_link.svg) no-repeat right 15px center;
    background-size: 8px auto;
}



/*------------------------------------------------------------
[PC]page_top
------------------------------------------------------------ */
#suntory_contents .page_top {
    margin: 0 0 30px;
    width: 100%;
    height: 50px;
    display: none;
}
#suntory_contents .page_top.active {
    display: block;
}
#suntory_contents .page_top.fixed {
    position: fixed;
    right: 0;
    bottom: 30px;
}
#suntory_contents .btn_pate_top a {
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #EDF4F7 url(../svg/icon_page_top.svg) no-repeat center center;
    background-size: 10px auto;
    text-decoration: none;
    text-indent: -99999px;
    position: absolute;
    right: 30px;
}
#suntory_contents .btn_pate_top a:hover {
    background: #D3DADD url(../svg/icon_page_top.svg) no-repeat center center;
    background-size: 10px auto;
}



}
