@charset "utf-8";

/* * * Reset * * */
html, body, div, section, article, aside, header, footer, main, nav,
h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ul, ol, li, blockquote, pre,
table, th, td, form, figure, fieldset, input, textarea, button {
    margin: 0;
    padding: 0;
}

ol, ul {
    list-style: none;
    list-style-type: none;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

a img {
    border: none;
}

*, *::before, *::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}

/* * * Setting * * */
html {
    scroll-behavior: smooth;
}

body {
    background: #FFF;
    font-family: "source-han-sans-japanese", "Source Han Sans", "源ノ角ゴシック", sans-serif;
    font-size: 1rem;
    line-height: 1.8em;
    color: #333;
    text-align: center;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}

#wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* * * general * * */
.inner {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 1em;
    text-align: left;
}

.PC{
    display: none;
}

a{
    color: #53769a;
}

a:hover {
	color: #E08A5A;
}

/*** header ***/
#header {
    width: 100%;
    background-color: #e8f3fd;
}
#header #logo{
    font-size: 85%;
    margin: 0.5em 0;
}


.header_visual {
    height: 235px;
    background: url("../img/bg_header.png") center center / cover no-repeat;
    display: flex;
    align-items: center;
}

.header_visual .inner {
    padding-top: 0.15em;
    text-align: center;
}

.header_visual h1 {
    font-size: 1.4375rem;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
}

.header_visual p {
    margin-top: 1.4em;
    padding-right: 0.4em;
    font-size: 0.8rem;
    line-height: 1.6;
}

/*** blocks ***/
.blocks {
    padding: 3.3em 0 5.7em;
}

.lead {
    line-height: 1.8em;
}

.blocks h2 {
    position: relative;
    margin: 2.4em 0 2.2em;
    padding: 0.8em 0 0.8em 1.5em;
    font-size: 1.2em;
    font-weight: 500;
    line-height: 1.4;
	color: #333;
	border-left: 4px solid #32639a;


	background: linear-gradient(
		to right,
		#d8e9f8 0%,
		#eef6fc 70%,
		transparent 100%
	);

}


/*
.blocks h2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0.2em;
	height: 100%;
	background: #32639a;
}
*/


.entry_block {
    margin-bottom: 3.1em;
	padding: 0 1em;
}

.entry_block h3 {
    padding-bottom: 0.3em;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #315b92;
    font-weight: 600;
    color: #315b92;
}
 
 
.other_block {
    margin-bottom: 3.1em;
} 
.other_block h3 {
    font-size: 96%; 
    padding-bottom: 0.3em;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #333;
    font-weight: 900;
 }


.download_list {
    margin-top: 0.9em;

}

.download_list li {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1em;
    padding: 1em 0;
    border-bottom: 1px solid #d2d2d2;
}
.download_list li:last-of-type{
    border:none;
}

.download_list li > span {
    width: 100%;
    padding: 0.7em 1em;
    border-radius: 0.5em;

    text-align: center;
    font-size: 95%;
	
	background: linear-gradient(
		to bottom,
		#d3e5f6 0%,
		#e5f0fa 100%
	);
}


.download_list a {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1em;

    line-height: 1.5;
    white-space: normal;
}

.download_text {
    text-decoration: underline;
}




.download_icon {
    font-family: "Material Symbols Outlined";
    font-size: 1.5em;
    font-weight: 400;
    font-style: normal;
    line-height: 1;
    display: inline-block;
    color: #315b92;
    text-decoration: none;
    font-variation-settings:
        "FILL" 0,
        "wght" 400,
        "GRAD" 0,
        "opsz" 24;
}

.download_icon::before {
    content: "download";
}
.download_icon_link::before {
    content: "link_2" !important;
}

.download_icon:hover {
    color: #E08A5A;
}







.download_list a {
    text-decoration: none;
}


.download_text {
    text-decoration: underline;
}

.bottom_text {
    margin: 0 0 2em 0;
    padding-bottom: 0.6em;
    border-bottom: 1px solid #d2d2d2;
}


/** page_top **/
#page_top {
    display: none;
}

/*** footer ***/
#footer {
    margin-top: auto;
    padding: 1.2em 2.4em;
    background: #e8f3fd;
    text-align: center;
}

.footer_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.4em;
}

#footer a,
#footer #copy {
    color: #222;
    font-size: 70%;
    line-height: 1.5;
}

#footer a {
    text-decoration: none;
}

/*** class ***/
.none {
    display: none;
}

.txt_right {
    text-align: right;
}

.t1em {
    margin-top: 1em;
}

.t2em {
    margin-top: 2em;
}

.t3em {
    margin-top: 3em;
}

.b1em {
    margin-bottom: 1em;
}

.b2em {
    margin-bottom: 2em;
}

.b3em {
    margin-bottom: 3em;
}

.flex_wrap {
    display: flex;
    flex-wrap: wrap;
}

a.hover80:hover img {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

/*** ul_type ***/
.ul_type01 li {
    text-indent: -2em;
    padding-left: 1.3em;
    margin-top: 1em;
}
.ul_type01 li::before {
  content: "check_small";
  font-family: "Material Symbols Outlined";
  font-size: 1.5em;
  vertical-align: middle;
  margin-right: 0.3em;
}


/*** ol_type ***/
.ol_type01 {
    counter-reset: ol-counter;
    list-style: none;
    padding-left: 0;
}
.ol_type01 li {
    counter-increment: ol-counter;
    text-indent: -2em;
    padding-left: 2em;
    margin-top: 1em;
}
.ol_type01 li::before {
    content: counter(ol-counter) ".";
    display: inline-block;
    width: 2em;
    text-indent: 0;
}









/*------------------------------------------------------
    mediaQuery
*-------------------------------------------------------*/
@media screen and (min-width: 640px) {
    body {
        font-size: 130%;
    }

    .PC{
        display: block;
    }
    .SP{
        display: none;
    }

    .header_visual{
        height: 400px;
    }
    .header_visual h1 {
        font-size: 150%; 
    }
    .header_visual p {
        font-size: 90%; 
    }

    .blocks {
        padding-top: 3.3em;
    }
    


    .blocks h2 {
        font-size: 1.6rem;
    }


    .download_list li {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 1.5em;
        padding: 1.5em 0;        
    }

    .entry_block {
        margin-bottom: 4em;
    }


    .download_list li > span {
        width: 50%;
    }

    .download_list a {
        flex: 1;
        white-space: nowrap;
    }    
    
    
    
}