@charset "utf-8";


@media screen and (min-width:1200px) {
.main_visual { height:600px; background:url(/img/main/back01.jpg) no-repeat center / cover; position:relative; }
.main_visual > div { position:absolute; display:inline-block; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; }
.main_visual > div > h4 { font-size:34px; line-height:42px; }
.main_visual > div > p { font-size:18px; line-height:36px; margin-bottom:50px; color:#666; }
.main_visual > div ul { display:flex; width:500px; column-gap:25px; margin:auto; }
.main_visual > div ul li { width:50%; }
.main_visual > div ul li h2 { font-size:48px; line-height:42px; font-weight:500; }
.main_visual > div ul li p { font-size:15px; color:#7588AA; padding:20px 0; }
.main_visual > div ul li a { width:150px; height:40px; line-height:40px; text-align:center; display:inline-block; color:#fff; }
.main_visual > div ul li:first-child h2 { color:#093687; }
.main_visual > div ul li:first-child a { background-color:#0062DF; }
.main_visual > div ul li:last-child h2 { color:#093687; }
.main_visual > div ul li:last-child a { background-color:#0b3587; }
.main_visual > div ul li.onbox { background-color:#093687; }

.main_trade { padding:50px 0; text-align:center; }
.main_trade > h2 { font-size:36px; line-height:70px; }
.main_trade > p { font-size:15px; color:#666; }
.main_trade > div > img { margin-top:50px; }
.main_trade ul { display:flex; width:800px; margin:auto; padding:50px 0; }
.main_trade ul li { width:50%; }
.main_trade ul li h6 { font-size:21px; color:#333; margin-bottom:12px; }
.main_trade ul li p { font-size:16px; line-height:27px; color:#999; }

.main_certif { padding:80px 0; text-align:center; background-color:#f4f5f8; }
.main_certif > h2 { font-size:36px; line-height:70px; }
.main_certif > p { font-size:17px; line-height:26px; color:#666; margin:auto; }
.main_certif > p span { display:block; color:#666; }
.main_certif ul { display:flex; width:800px; padding:50px 0; margin:auto; }
.main_certif ul li { width:50%; text-align:center; }
.main_certif ul li span { display:block; margin-bottom:20px; }
.main_certif ul li span svg { margin:auto; }
.main_certif ul li p { color:#0b3587; font-size:12px; font-weight:400; }

.ct2 { padding:50px 0; }
.ct2>div { width:950px; margin:0 auto; }
.ct2 h2 {
    font-family: 'SCDream6', sans-serif;
    font-size: 1.875rem;
    text-align: center;
    margin-bottom: 50px;
}

.ct2 .item {
    position:relative;
    height: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    flex: 1 1 20%;
    padding: 10px;
    transition: all ease .5s;
    background-size: cover !important;
    background-position: center !important;
}

.ct2 .item:after{
    position:absolute;
    content:'';
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.5);
    transition:all ease .5s;
    border-radius:15px;
}

.ct2 .item:hover { flex: 350px 0 0; }
.ct2 .item:hover:after{ opacity:0; }
.ct2 .item1 { background-image: url(../images/contain-con-1.png); }
.ct2 .item2 { background-image: url(../images/contain-con-2.png); }
.ct2 .item3 { background-image: url(../images/contain-con-3.png); }
.ct2 .item4 { background-image: url(../images/contain-con-4.png); }
.ct2 .item5 { background-image: url(../images/contain-con-5.png); }
.ct2 .item span { color: #fff; font-size: 1.125rem; font-weight: 600; z-index:9999; }
.ct2 .item:hover span { text-shadow:0 0px 10px rgba(0, 0, 0, 1) }
}

@media screen and (max-width:1200px) and (min-width:901px) {
.main_visual { height:600px; background:url(/img/main/back01.jpg) no-repeat center / cover; position:relative; }
.main_visual > div { position:absolute; display:inline-block; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; }
.main_visual > div > h4 { font-size:38px; line-height:42px; }
.main_visual > div > p { font-size:18px; line-height:36px; margin-bottom:50px; color:#666; }
.main_visual > div ul { display:flex; width:500px; column-gap:25px; margin:auto; }
.main_visual > div ul li { width:50%; }
.main_visual > div ul li h2 { font-size:42px; line-height:42px; font-weight:bolder; }
.main_visual > div ul li p { font-size:15px; color:#7588AA; padding:20px 0; }
.main_visual > div ul li a { width:150px; height:40px; line-height:40px; text-align:center; display:inline-block; color:#fff; }
.main_visual > div ul li:first-child h2 { color:#093687; }
.main_visual > div ul li:first-child a { background-color:#0062DF; }
.main_visual > div ul li:last-child h2 { color:#093687; }
.main_visual > div ul li:last-child a { background-color:#0b3587; }
.main_visual > div ul li.onbox { background-color:#093687; }

.main_trade { padding:50px 0; text-align:center;border-top:1px solid #eee; border-bottom:1px solid #eee; }
.main_trade > h2 { font-size:42px; line-height:52px; }
.main_trade > p { font-size:15px; color:#666; }
.main_trade > div > img { margin-top:50px; }
.main_trade ul { display:flex; width:800px; margin:auto; padding:50px 0; }
.main_trade ul li { width:50%; }
.main_trade ul li h6 { font-size:18px; color:#333; margin-bottom:20px; }
.main_trade ul li p { font-size:15px; line-height:24px; color:#999; }

.main_certif { padding:50px 0; text-align:center; background-color:#f4f5f8; }
.main_certif > h2 { font-size:42px; line-height:52px; }
.main_certif > p { font-size:15px; line-height:24px; color:#666; width:500px; word-break:keep-all; margin:auto; }
.main_certif ul { display:flex; width:600px; padding:50px 0; margin:auto; }
.main_certif ul li { width:50%; text-align:center; }
.main_certif ul li span { display:block; margin-bottom:20px; }
.main_certif ul li span svg { margin:auto; }
.main_certif ul li p { color:#0b3587; font-size:11px; }

.ct2 { padding:50px 0; }
.ct2 { max-width:950px; margin:0 auto; }
.ct2>div { width:950px; margin:0 auto; }
.ct2 h2 {
    font-family: 'SCDream6', sans-serif;
    font-size: 1.875rem;
    text-align: center;
    margin-bottom: 50px;
}

.ct2 .item {
    position:relative;
    height: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    flex: 1 1 20%;
    padding: 10px;
    transition: all ease .5s;
    background-size: cover !important;
    background-position: center !important;
}

.ct2 .item:after{
    position:absolute;
    content:'';
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.5);
    transition:all ease .5s;
    border-radius:15px;
}

.ct2 .item:hover { flex: 350px 0 0; }
.ct2 .item:hover:after{ opacity:0; }
.ct2 .item1 { background-image: url(../images/contain-con-1.png); }
.ct2 .item2 { background-image: url(../images/contain-con-2.png); }
.ct2 .item3 { background-image: url(../images/contain-con-3.png); }
.ct2 .item4 { background-image: url(../images/contain-con-4.png); }
.ct2 .item5 { background-image: url(../images/contain-con-5.png); }
.ct2 .item span { color: #fff; font-size: 1.125rem; font-weight: 600; z-index:9999; }
.ct2 .item:hover span { text-shadow:0 0px 10px rgba(0, 0, 0, 1) }
}

@media screen and (max-width:900px) {
.main_visual { padding:50px 20px; background:url(/img/main/back01.jpg) no-repeat center / cover; position:relative; }
.main_visual > div {  text-align:center; }
.main_visual > div > h4 { font-size:32px; line-height:36px; display:none; }
.main_visual > div > p { font-size:24px; line-height:36px; margin-bottom:50px; color:#333; word-break:keep-all; }
.main_visual > div ul { display:flex; column-gap:15px; margin:auto; }
.main_visual > div ul li { width:50%; }
.main_visual > div ul li h2 { font-size:42px; line-height:42px; font-weight:bolder; }
.main_visual > div ul li p { font-size:15px; color:#666; padding:20px 0; }
.main_visual > div ul li a { width:150px; height:40px; line-height:40px; text-align:center; display:inline-block; color:#fff; }
.main_visual > div ul li:first-child h2 { color:#0162e4; }
.main_visual > div ul li:first-child a { background-color:#0162e4; }
.main_visual > div ul li:last-child h2 { color:#0b3587; }
.main_visual > div ul li:last-child a { background-color:#0b3587; }

.main_trade { padding:50px 20px; text-align:center; }
.main_trade > h2 { font-size:32px; line-height:36px; }
.main_trade > p { font-size:15px; color:#666; }
.main_trade > div > img { margin-top:50px; width:100%; }
.main_trade ul { margin:auto; padding:50px 0 0; }
.main_trade ul li { padding:10px 0; }
.main_trade ul li h6 { font-size:18px; color:#333; margin-bottom:20px; }
.main_trade ul li p { font-size:15px; line-height:24px; color:#999; }

.main_certif { padding:50px 20px; text-align:center; background-color:#f4f5f8; }
.main_certif > h2 { font-size:32px; line-height:36px; word-break:keep-all; }
.main_certif > p { font-size:15px; line-height:24px; color:#666; word-break:keep-all; margin:auto; }
.main_certif ul { padding:50px 0; margin:auto; }
.main_certif ul li { padding:10px 0; text-align:center; }
.main_certif ul li span { display:block; margin-bottom:20px; }
.main_certif ul li span svg { margin:auto; }
.main_certif ul li p { color:#0b3587; font-size:11px; }

.ct2 { padding:50px 20px; }
.ct2 { margin:0 auto; }
.ct2 > div { margin:0 auto; display:block; }
.ct2 h2 {
    font-family: 'SCDream6', sans-serif;
    font-size: 1.875rem;
    text-align: center;
    margin-bottom: 50px;
}

.ct2 .item {
    position:relative;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    flex: 1 1 20%;
    padding: 10px;
    transition: all ease .5s;
    background-size: cover !important;
    background-position: center !important;
	margin-bottom:10px;
}

.ct2 .item:after{
    position:absolute;
    content:'';
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.5);
    transition:all ease .5s;
    border-radius:15px;
}

.ct2 .item:hover { flex: 350px 0 0; }
.ct2 .item:hover:after{ opacity:0; }
.ct2 .item1 { background-image: url(../images/contain-con-1.png); }
.ct2 .item2 { background-image: url(../images/contain-con-2.png); }
.ct2 .item3 { background-image: url(../images/contain-con-3.png); }
.ct2 .item4 { background-image: url(../images/contain-con-4.png); }
.ct2 .item5 { background-image: url(../images/contain-con-5.png); }
.ct2 .item span { color: #fff; font-size: 1.125rem; font-weight: 600; z-index:9999; }
.ct2 .item:hover span { text-shadow:0 0px 10px rgba(0, 0, 0, 1) }

}