@charset "UTF-8";
/*========================================
朝日新聞デジタル【PC】総合ガイド　共通
/info_files/1source/css/info_pc.css

--2023-07-03-09:00--(金鍵の位置調整)
--2023-06-12-09:00--(reron追加)
--2023-03-27-09:00--(横幅1024pxに統一)
--2023-02-20-09:00--(couse_list.php改修に伴う修正)
========================================*/
* {
margin: 0;
padding: 0;
vertical-align: top;
box-sizing: border-box;
font-size: 100%;
scroll-behavior: smooth;
}

html {
width: 100%;
}

body {
width: 100%;
text-align: center;
line-height: 1.4;
letter-spacing: 1px;
text-size-adjust: 100%;
color: #1E1E17;
}

a {
color: #1E1E17;
text-decoration: none;
}

a img:hover {
opacity: 0.7;
}

img {
font-size: 0;
line-height: 0;
height: auto;
}

ul {
list-style: none;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

.Block {
display: inline-block;
white-space: nowrap;
}

/*========================================
ヘッダー
========================================*/
header {
width: 100%;
min-width: 1024px;
display: block;
}

header a:hover {
color: #b90000;
}

.GridInner {
display: flex;
width: 1024px;
margin: 0 auto;
padding: 16px 10px;
}

.GridInner .siteLogo {
width: 130px;
}

.GridInner .infoGuide {
margin-left: 46px;
}

.GridInner .infoGuide .GuideTxt {
font-size: 24px;
line-height: 1.1;
color: #3C3C35;
display: inline-block;
padding: 10px 10px 0 0;
}

.GridInner .infoGuide .Digimo {
width: 38px;
margin: -4px 0;
}

.GridInner .linkUser {
flex: 1;
display: flex;
justify-content: flex-end;
visibility: visible;
padding: 0 20px;
}

.GridInner .linkUser p {
display: inline-flex;
align-items: center;
}

.GridInner .linkUser .AsaTxtLink {
white-space: nowrap;
font-size: 13px;
line-height: 1.1;
font-weight: bold;
padding-right: 20px;
}

.GridInner .linkUser .AsaTxtLink a {
display: inline-block;
padding-left: 18px;
position: relative;
}

.GridInner .linkUser .AsaTxtLink a::before {
position: absolute;
top: 4px;
margin: auto;
content: '';
vertical-align: middle;
left: 3px;
width: 5px;
height: 5px;
border-top: 1px solid #787871;
border-right: 1px solid #787871;
transform: rotate(45deg);
}

.GridInner .linkUser .UserName {
max-width: 180px;
}

.GridInner .linkUser .UserName span {
display: inline-block;
font-size: 13px;
line-height: 1.1;
text-align: left;
font-weight: bold;
padding-right: 18px;
word-break: break-all;
position: relative;
}

.GridInner .linkUser .UserName span::after {
position: absolute;
display: block;
content: '様';
width: 1.2em;
height: 1.1em;
bottom: 0;
right: 0;
text-align: right;
}

.GridInner .Login {
display: flex;
justify-content: flex-end;
margin: 4px 0;
padding-left: 20px;
border-left: 1px solid #C4C4C4;
}

.GridInner .Login .LoginGuest {
display: block;
font-size: 13px;
font-weight: bold;
line-height: 1;
padding: 10px;
}

#UserSignup {
font-size: 13px;
line-height: 1;
padding: 8px 12px;
display: inline-block;
font-weight: bold;
color: #b90000;
border: 1px solid #b90000;
border-radius: 4px;
}

#UserSignup:hover {
background: #B90000;
color: #FFF;
}

#MyPageBtn {
width: auto;
background: none;
cursor: pointer;
position: relative;
margin: 4px 10px 0 10px;
}

#MyPageBtn > p {
width: 97px;
min-height: 25px;
text-indent: 0;
background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25'><path d='m12,3C6.48,3,2,7.48,2,13c.53,13.26,19.47,13.26,20,0,0-5.52-4.48-10-10-10Zm0,3c3.96.1,3.96,5.9,0,6-3.96-.1-3.96-5.9,0-6Zm0,14.2c-2.5,0-4.71-1.28-6-3.22.03-1.99,4-3.08,6-3.08s5.97,1.09,6,3.08c-1.29,1.94-3.5,3.22-6,3.22Z' fill='%235a5a53'/></svg>") no-repeat;
}

#MyPageBtn > p span {
display: block;
padding: 7px 0 0 20px;
font-size: 13px;
line-height: 1;
font-weight: bold;
letter-spacing: 0;
}

#MyPageBtn:hover #MyPageNav {
display: block;
}

#MyPageNav {
display: none;
font-size: 13px;
line-height: 1.4;
font-weight: bold;
text-align: left;
position: absolute;
top: 20px;
right: 0;
background: #F8F8F8;
padding: 16px;
vertical-align: baseline;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
z-index: 10;
}

#MyPageNav > li {
width: 200px;
}

#MyPageNav .LoginStatus {
color: #b90000;
}

#MyPageNav .LoginStatus li {
padding: 4px 4px 12px;
border-bottom: 1px solid #D2D2CB;
}

#MyPageNav .LoginStatus li span {
display: block;
}

#MyPageNav .LoginStatus li span:not(:first-child) {
font-size: 12px;
text-indent: .5em;
margin-top: 4px;
}

#MyPageNav .LoginStatus li small {
font-size: 100%;
}

#MyPageNav .LogoutArea a {
display: block;
text-align: center;
padding: 4px 8px;
border-radius: 4px;
margin: 0 auto;
color: #fff;
background: #555;
box-sizing: border-box;
}

#MyPageNav .LoginNav {
margin: 8px 0 4px;
}

#MyPageNav .LoginNav li {
padding-bottom: 8px;
}

#MyPageNav .LoginNav a {
display: block;
padding: 3px;
color: #3c3c35;
}

#SpSiteNavBtn, #SpMyPageSlide, #SpSiteNavSlide {
display: none;
}

.InfoNavi {
text-align: center;
padding: 13px 10px;
position: relative;
border-top: 1px solid #E6E6DF;
border-bottom: 1px solid #5A5A53;
}

.InfoNavi ul {
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
width: 980px;
border-left: 1px solid #C4C4C4;
}

.InfoNavi li {
flex: 1;
font-size: 13px;
line-height: 1.1;
font-weight: bold;
text-align: center;
vertical-align: middle;
border-right: 1px solid #C4C4C4;
}

.InfoNavi li:last-child a {
padding: 9px 0 0;
}

.InfoNavi li a {
display: block;
width: 100%;
padding: 14px 0;
}

.InfoNavi li a br {
display: none;
}

.InfoNavi li a .TxtKojinsettei {
display: block;
font-size: 12px;
font-weight: normal;
}

.InfoNavi li a .TxtKinou::before {
content: '・';
}

/*========================================
コンテンツ部分
========================================*/
.InfoContents {
width: 1024px;
margin: 0 auto;
text-align: left;
padding: 0 22px;
}

.InfoContents * {
position: relative;
}

.InfoContents a:hover {
color: #B90000;
}

.SpOn, .PcOff {
display: none !important;
}

.ArwUl, .ArwUl li {
display: block;
}

.ArwUl li a {
display: inline-block;
padding: 6px 0 6px 16px;
vertical-align: middle;
text-decoration: none;
font-size: 14px;
min-width: 300px;
}

.ArwUl li a::before {
position: absolute;
top: 12px;
margin: auto;
content: '';
vertical-align: middle;
left: 3px;
width: 6px;
height: 6px;
border-top: 1px solid #787871;
border-right: 1px solid #787871;
transform: rotate(45deg);
}

.Cf:after, .clearfix:after {
clear: both;
display: block;
visibility: hidden;
font-size: 0;
content: '';
height: 0;
}

.BreadCrumb {
padding: 14px 0 0;
margin: 0 0 14px;
line-height: 0;
}

.BreadCrumb .Genre, .BreadCrumb .Genre a {
color: #b90000;
}

.BreadCrumb li {
display: inline-block;
font-size: 12px;
line-height: 1.1;
letter-spacing: 0;
white-space: nowrap;
}

.BreadCrumb li:not(:first-child) {
font-weight: bold;
}

.BreadCrumb li:not(:last-child)::after {
padding: 0 9px 0 8px;
font-weight: normal;
color: #96968f;
content: ">";
}

.BreadCrumb li a {
color: #3c3c35;
text-decoration: none;
}

.BreadCrumb li a:hover {
text-decoration: underline;
}

#ContentsInner {
display: flex;
flex-wrap: wrap;
margin-bottom: 50px;
}

#ContentsInner #Main {
width: 660px;
}

#ContentsInner #Sub {
width: 300px;
margin: 0 0 0 auto;
}

.PageTitle {
background: #f2f1f1;
min-height: 80px;
min-width: 1024px;
margin-left: -22px;
}

.PageTitle h1, .PageTitle .h1 {
text-align: left;
margin: 0 auto;
padding: 25px 10px 0;
font-size: 22px;
font-weight: bold;
color: #b90000;
width: 1024px;
}

@media screen and (min-width: 1024px) {
.PageTitle {
margin: 0;
width: 100vw;
left: 50%;
transform: translateX(-50%);
} }
.mb10 {
margin-bottom: 10px !important;
}

.CP_BannerArea {
margin: 0 auto 20px;
padding: 0;
text-align: center;
}

.CP_BannerArea span {
display: none;
}

#Sub {
padding: 26px 0;
}

#Sub .InfoNaviP {
margin: 5px 10px;
}

#Sub .CenterButton {
text-align: center;
margin: 0 0 10px;
}

#Sub .CenterButton img {
margin: 0 auto;
}

#Sub .InfoNaviTitle {
clear: both;
margin: 10px 0;
padding: 8px 0;
border-top: 1px solid #DCDCD5;
border-bottom: 1px solid #DCDCD5;
text-align: center;
color: #B90000;
font-size: 14px;
}

#Sub .InfoNaviList {
margin-top: 12px;
}

#Sub .InfoNaviList li {
list-style-type: none;
}

#Sub .InfoNaviList li a {
display: block;
padding-left: 18px;
margin: 5px 10px;
}

#Sub .InfoNaviList li a::before {
position: absolute;
top: 6px;
margin: auto;
content: '';
left: 3px;
width: 6px;
height: 6px;
border-top: 2px solid #96968F;
border-right: 2px solid #96968F;
transform: rotate(45deg);
}

#Sub .ContactArea {
margin-top: 20px;
text-align: center;
letter-spacing: normal;
}

#Sub .ContactBox {
border: 1px solid #DCDCD5;
padding: 16px 16px 8px;
margin: 0 0 16px;
}

#Sub .ContactBox dt {
font-size: 88%;
line-height: 1.2;
font-weight: bold;
border-bottom: 1px solid #DCDCD5;
padding: 0 0 10px;
margin: 0 0 6px;
}

#Sub .TitleService {
color: #B90000;
}

#Sub .TxtDial {
font-size: 88%;
line-height: 1;
font-weight: bold;
padding: 10px 0 0;
}

#Sub .TxtTelNum {
font-size: 214%;
line-height: 1.2;
font-weight: 800;
font-family: Arial Black;
color: #787871;
margin: 0 0 6px;
}

#Sub .OfficeHours {
font-size: 85%;
text-align: left;
margin: 0 0 6px;
}

#Sub .RnaviBtn {
padding: 6px 0;
}

#Sub .RnaviBtn a {
display: block;
border-radius: 2px;
font-size: 88%;
font-weight: bold;
padding: 10px 0;
}

#Sub .RnaviBtn .BtnRed {
background: #B90000;
color: #FFF;
}

#Sub .RnaviBtn .BtnBlack {
background: #3C3C35;
color: #FFF;
}

#Sub .RnaviBtn .BtnGray {
background: linear-gradient(to bottom, white 0%, #edebeb 99%);
border: 1px solid #DCDCD5;
}

#Sub .RnaviBtn a.BtnRed:hover, #Sub .RnaviBtn a.BtnBlack:hover {
color: #FFF;
opacity: 0.8;
}

/*====== SectionTitle =========*/
.SectionTitle {
margin: 20px 0;
padding: 10px 0;
border-bottom: 4px solid #E6E6DF;
}

.SectionTitle h2 {
padding: 0 0 0 10px;
font-size: 125%;
}

/*====== link =========*/
.LeftLink {
display: block;
text-align: right;
}

.LeftLink a {
display: inline-block;
padding-left: 22px;
margin: 6px 10px 5px auto;
font-size: 14px;
}

.LeftLink a::before {
position: absolute;
display: block;
content: '';
width: 18px;
height: 18px;
left: 0;
top: 0;
border-radius: 9px;
background: #B90000;
}

.LeftLink a::after {
position: absolute;
display: block;
content: '';
top: 5px;
left: 4px;
width: 5px;
height: 5px;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
transform: rotate(45deg);
}

a.Blank {
text-decoration: underline;
}

a.Blank::after {
display: inline-block;
content: '';
margin: 0 4px 0 2px;
width: 12px;
height: 14px;
background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='26' height='60' viewBox='0 0 26 60'><polygon points='17.3 49.2 17.3 57.8 2.2 57.8 2.2 42.7 10.8 42.7 12.4 40.5 0 40.5 0 60 19.5 60 19.5 47.6 17.3 49.2' fill='%23cdcdc6'/><path d='M26,35.5c0,.2-.1,11.8-.1,12,0,2.3-3.6,2.4-3.6.1V40.1L9.5,53h0A1.8,1.8,0,0,1,7,50.5L19.9,37.6H12.4c-2.3,0-2.2-3.6.1-3.6H24.2A1.8,1.8,0,0,1,26,35.5Z' fill='%23b90000'/><polygon points='17.3 15.2 17.3 23.8 2.2 23.8 2.2 8.7 10.8 8.7 12.4 6.5 0 6.5 0 26 19.5 26 19.5 13.6 17.3 15.2' fill='%23cdcdc6'/><path d='M26,1.5c0,.2-.1,11.8-.1,12,0,2.3-3.6,2.4-3.6.1V6.1L9.5,19h0A1.8,1.8,0,0,1,7,16.5L19.9,3.6H12.4c-2.3,0-2.2-3.6.1-3.6H24.2A1.8,1.8,0,0,1,26,1.5Z' fill='%23b9b9b2'/></svg>") right 0 top 2px/12px auto no-repeat;
}

a.Blank:hover::after {
background-position: right bottom;
}

.icon_gold {
display: inline-block;
min-width: 1em;
min-height: 1em;
vertical-align: middle;
margin-bottom: 0.2em;
background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58 64'><path d='M48.7,22H44.4V13.7a11,11,0,0,0-11-11H24.7a11.2,11.2,0,0,0-11,11V22H9.3A4.4,4.4,0,0,0,5,26.2H5V57a4.3,4.3,0,0,0,4.3,4.3H48.6a4.2,4.2,0,0,0,4.3-4.2h0V26.3A4.1,4.1,0,0,0,49,22ZM31.2,43.6v8.9H26.9V43.6a6.6,6.6,0,0,1-4.5-6.3,6.7,6.7,0,0,1,6.7-6.6,6.6,6.6,0,0,1,6.5,6.6A6.7,6.7,0,0,1,31.2,43.6ZM40,22H18V13.7a6.5,6.5,0,0,1,6.5-6.5h8.7a6.5,6.5,0,0,1,6.5,6.5h0V22Z' fill='%23fbb03b'/></svg>") top left/auto 100% no-repeat;
}

/*========================================
フッター
========================================*/
.InfoFooter {
width: 100%;
margin: 0 auto;
padding: 0;
position: relative;
min-width: 1024px;
background: #EBEBE4;
border-top: 1px solid #E1E1DA;
color: #696962;
font-size: 75%;
}

.InfoFooter a {
color: #696962;
}

.InfoFooter dl, .InfoFooter ul {
text-align: left;
}

.InfoFooter .SpInfoFooterNavi {
display: none;
}

.InfoFooter .ToTop {
width: 1024px;
position: relative;
margin: 0 auto;
}

.InfoFooter .ToTop a {
position: absolute;
display: inline-block;
top: -2.4em;
right: 10px;
height: 2.4em;
padding: 8px 10px 0;
font-size: 12px;
line-height: 1.2;
font-weight: bold;
background: #F5F5EE;
border-top: 1px solid #E1E1DA;
border-right: 1px solid #E1E1DA;
border-left: 1px solid #E1E1DA;
z-index: 2;
}

.InfoFooter .FooterServices {
background: #F5F5EE;
padding: 15px 10px;
border-bottom: 1px solid #D7D7D0;
}

.InfoFooter .FooterServices dl {
width: 980px;
display: inline-flex;
margin: 0 auto;
}

.InfoFooter .FooterServices dl dt {
font-weight: bold;
}

.InfoFooter .FooterServices dl dt a {
display: inline-block;
padding: 6px 0;
}

.InfoFooter .FooterServices dl dt a:hover {
text-decoration: underline;
}

.InfoFooter .FooterServices dl dd {
flex: 1;
}

.InfoFooter .FooterServices dl .reron {
padding: 0 34px;
}

.InfoFooter .FooterServices dl .reron a {
width: 160px;
height: 20px;
display: block;
font-weight: normal;
background: url("../../../css/images/logo_reron.svg") left top/100% auto no-repeat;
}

.InfoFooter .FooterServices dl .reron a:hover img {
display: none;
}

.InfoFooter .FooterInformation {
min-width: 1024px;
margin: 0 auto;
padding: 20px 10px 30px 20px;
display: inline-flex;
}

.InfoFooter .FooterInformation dt {
font-weight: bold;
}

.InfoFooter .FooterInformation dl {
width: 210px;
}

.InfoFooter .FooterInformation dl.WorldWideSite {
width: 320px;
}

.InfoFooter .FooterInformation dl a {
display: inline-block;
padding: 1.5px 0;
}

.InfoFooter .FooterInformation dl a:hover {
text-decoration: underline;
}

.InfoFooter .FooterAboutSite {
padding: 20px 0;
width: 1024px;
margin: 0 auto;
border-top: 1px solid #D7D7D0;
text-align: left;
}

.InfoFooter .FooterAboutSite ul {
padding: 0 10px;
display: inline-flex;
}

.InfoFooter .FooterAboutSite ul li {
text-align: center;
}

.InfoFooter .FooterAboutSite ul li a {
display: inline-block;
padding: 0 12px;
border-right: 1px solid #D7D7D0;
}

.InfoFooter .FooterAboutSite ul li a:hover {
text-decoration: underline;
}

.InfoFooter .FooterAboutSite ul li:last-child a {
border: none;
}

.InfoFooter .LangSelect {
display: none;
}

.InfoFooter .Copyright {
width: 1024px;
margin: 0 auto;
padding: 0 10px 20px 20px;
font-size: 12px;
line-height: 1.2;
letter-spacing: 1px;
text-align: left;
color: #696962;
}

.InfoFooter .Copyright small {
display: block;
padding-top: 6px;
font-family: Arial,Helvetica,sans-serif;
}
