Skip to content

sora / achievement

Go to a project
Commit a106c62c by Orine Matsui
Options

セミナーのテンプレートを追加

parent 22e4e0a2
Expand all
Inline Side-by-side
Showing with 230 additions and 34 deletions
achievement-official.conohawing.com/common_previous/css/seminar.css
...@@ -33,10 +33,9 @@ body { ...@@ -33,10 +33,9 @@ body {
} }
.c-mainvisual { .c-mainvisual {
height: 360px; height: 360px;
background-image: url(/assets/img/seminar/img_seminar_mv_NVY.gif);
background-position: top center; background-position: top center;
background-repeat: repeat!important; background-repeat: repeat!important;
background-size: auto!important; background-size: 1207px 134px!important;
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
...@@ -46,10 +45,12 @@ body { ...@@ -46,10 +45,12 @@ body {
position: relative; position: relative;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.c-mainvisual { .c-mainvisual {
margin-top: 100px; margin-top: 100px;
height: 250px; height: 250px;
background-size: 604px 67px!important;
} }
} }
.p-seminar-orig .c-mainvisual { .p-seminar-orig .c-mainvisual {
...@@ -69,8 +70,8 @@ body { ...@@ -69,8 +70,8 @@ body {
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.c-mainvisual__ttl { .c-mainvisual__ttl {
transform: translateY(-30px); transform: translateY(-10px);
font-size: 3rem; font-size: 2.6rem;
} }
} }
.c-mainvisual__txt { .c-mainvisual__txt {
...@@ -93,7 +94,7 @@ body { ...@@ -93,7 +94,7 @@ body {
width: 80%; width: 80%;
} }
} }
.l-btn--center { .l-btn {
text-align: center; text-align: center;
} }
.c-btn1__txt { .c-btn1__txt {
...@@ -108,13 +109,26 @@ body { ...@@ -108,13 +109,26 @@ body {
box-sizing: border-box; box-sizing: border-box;
padding: 18px 0 16px; padding: 18px 0 16px;
position: relative; position: relative;
text-align: center;
} }
.l-btn--center {
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.l-btn + .l-btn {
margin-top: 20px;
}
.c-btn1__txt { .c-btn1__txt {
width: 100%; width: 100%;
font-size: 1.4rem; font-size: 1.4rem;
line-height: 1.4; line-height: 1.4;
padding: 12px 0 10px; padding: 12px 0 10px;
font-weight: 400;
} }
} }
.c-btn1__txt::after { .c-btn1__txt::after {
...@@ -460,6 +474,9 @@ body { ...@@ -460,6 +474,9 @@ body {
width: 32%; width: 32%;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.c-list2 {
margin-top: 20px;
}
.c-list2__item { .c-list2__item {
width: 100%; width: 100%;
margin: 0 0 15px; margin: 0 0 15px;
...@@ -481,10 +498,14 @@ body { ...@@ -481,10 +498,14 @@ body {
width: 23.5%; width: 23.5%;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.c-list3 {
display: block;
margin-top: 20px;
}
.c-list3__item { .c-list3__item {
width: 100%; width: 100%;
margin: 0 0 15px; margin: 0 0 15px;
padding: 16vw 15px 15px; padding: 15px;
} }
} }
...@@ -507,12 +528,14 @@ body { ...@@ -507,12 +528,14 @@ body {
width: 100%; width: 100%;
margin: 20px 0 0 0; margin: 20px 0 0 0;
} }
.c-list2__item:first-child,
.c-list3__item:first-child {
margin: 0;
}
} }
.c-list2__ttl, .c-list2__ttl,
.c-list3__ttl { .c-list3__ttl {
font-size: 1.8rem; font-size: 3.0rem;
line-height: 1.2; line-height: 1.2;
color: #fff; color: #fff;
font-weight: bold; font-weight: bold;
...@@ -540,9 +563,11 @@ body { ...@@ -540,9 +563,11 @@ body {
} }
.c-list2__txt, .c-list2__txt,
.c-list3__txt { .c-list3__txt {
font-size: 1.6rem; font-size: 2.0rem;
line-height: 1.5; line-height: 1.5;
color: #fff; color: #fff;
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
font-weight: 600;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.c-list2__txt, .c-list2__txt,
...@@ -689,42 +714,49 @@ body { ...@@ -689,42 +714,49 @@ body {
/* /*
------------------------------------------------------------*/ ------------------------------------------------------------*/
.seminar3 { .seminar3,
.seminar5 {
padding: 75px 0 70px; padding: 75px 0 70px;
background-color: #1f3563;
color: #fff; color: #fff;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar3 { .seminar3,
.seminar5 {
padding: 30px 0; padding: 30px 0;
} }
} }
.seminar3 .c-title1 { .seminar3 .c-title1,
.seminar5 .c-title1 {
text-align: center; text-align: center;
margin: 0 0 26px; margin: 0 0 26px;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar3 .c-title1 { .seminar3 .c-title1,
.seminar5 .c-title1 {
padding: 0 15px; padding: 0 15px;
} }
} }
.seminar3 .c-title1__txt { .seminar3 .c-title1__txt,
.seminar5 .c-title1__txt {
margin-bottom: 20px; margin-bottom: 20px;
display: inline-block; display: inline-block;
color: #beac56; color: #beac56;
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif; font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar3 .c-title1__txt { .seminar3 .c-title1__txt,
.seminar5 .c-title1__txt {
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
.seminar3 .c-title1__txt img { .seminar3 .c-title1__txt img,
.seminar5 .c-title1__txt img {
max-width: 340px; max-width: 340px;
height: auto; height: auto;
} }
.seminar3 .c-title1__txt:after { .seminar3 .c-title1__txt:after,
.seminar5 .c-title1__txt:after {
width: 100vw; width: 100vw;
} }
.seminar3__txt { .seminar3__txt {
...@@ -739,6 +771,29 @@ body { ...@@ -739,6 +771,29 @@ body {
font-size: 1.4rem; font-size: 1.4rem;
} }
} }
.seminar5 .c-list2__item,
.seminar5 .c-list3__item {
background-color: #fff;
}
.seminar3 .c-list2__ttl,
.seminar3 .c-list3__ttl,
.seminar5 .c-list2__ttl,
.seminar5 .c-list3__ttl {
margin-bottom: 0;
}
.seminar5 .c-list2__ttl,
.seminar5 .c-list2__txt,
.seminar5 .c-list3__ttl,
.seminar5 .c-list3__txt {
color: #363636!important;
}
@media screen and (max-width: 767px) {
.seminar4,
.seminar6 {
padding: 30px 0 40px;
}
}
/* /*
------------------------------------------------------------*/ ------------------------------------------------------------*/
...@@ -746,40 +801,163 @@ body { ...@@ -746,40 +801,163 @@ body {
padding: 75px 0 120px; padding: 75px 0 120px;
background-color: #fff; background-color: #fff;
} }
.seminar4 .bgGRY { .seminar6 {
margin-bottom: 65px;
padding: 75px 0 0;
background-color: #fff;
}
.seminar4 .bgGRY,
.seminar6 .bgGRY {
background-color: #ececec; background-color: #ececec;
} }
.seminar4 .c-imgtext1 {
margin-top: 40px;
}
.seminar4 .c-imgtext1 + .c-imgtext1 {
margin-top: 60px;
}
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar4 { .seminar4,
.seminar6 {
padding: 30px 0 40px; padding: 30px 0 40px;
} }
} }
.seminar4 .c-title1 { @media screen and (max-width: 767px) {
.seminar4 .c-imgtext1 {
margin-top: 20px;
}
.seminar4 .c-imgtext1 + .c-imgtext1 {
margin-top: 40px;
}
}
.seminar4 .c-title1,
.seminar6 .c-title1 {
text-align: center; text-align: center;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar4 .c-title1 { .seminar4 .c-title1,
.seminar6 .c-title1 {
margin-bottom: 0; margin-bottom: 0;
} }
} }
.seminar4 .c-title1__txt { .seminar4 .c-title1__txt,
.seminar6 .c-title1__txt {
margin-bottom: 20px; margin-bottom: 20px;
display: inline-block; display: inline-block;
font-family: a-otf-midashi-go-mb31-pr6n, sans-serif; font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
} }
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
.seminar4 .c-title1__txt { .seminar4 .c-title1__txt,
.seminar6 .c-title1__txt {
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
.seminar4 .c-title1__txt img { .seminar4 .c-title1__txt img,
.seminar6 .c-title1__txt img {
max-width: 340px; max-width: 340px;
height: auto; height: auto;
} }
.seminar4 .c-title1__txt:after { .seminar4 .c-title1__txt:after,
.seminar6 .c-title1__txt:after {
width: 100vw; width: 100vw;
} }
@media screen and (max-width: 767px) {
.seminar6 {
margin-bottom: 0;
}
}
/*
------------------------------------------------------------*/
.seminar-btnset {
margin-top: 65px;
padding: 0 0 105px;
background-color: #fff;
}
.seminar-btnset > .container {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.seminar-btnset .c-btn1__txt {
font-size: 1.6rem;
}
.seminar-btnset .c-btn1__txt strong {
font-size: 2.4rem;
font-weight: 900;
}
.c-btn1-red {
background: #7d0000;
}
.c-btn1-red .c-btn1__txt {
color: #fff;
border: 2px solid #7d0000;
}
.c-btn1-red .c-btn1__txt::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
@media screen and (max-width: 767px) {
.seminar-btnset {
margin-top: 0;
padding: 0 0 65px;
}
.seminar-btnset > .container {
flex-direction: column;
}
.seminar-btnset .l-btn,
.seminar-btnset .c-btn1,
.seminar-btnset .c-btn1__txt {
display: block;
width: 100%;
}
.seminar-btnset .c-btn1__txt {
font-size: 1.4rem;
}
.seminar-btnset .c-btn1__txt strong {
font-size: 2.0rem;
font-weight: 900;
}
}
/*
------------------------------------------------------------*/
.c-table2 { .c-table2 {
margin-top: 40px; margin-top: 40px;
...@@ -828,7 +1006,7 @@ body { ...@@ -828,7 +1006,7 @@ body {
.c-table2 dt { .c-table2 dt {
width: 200px; width: 200px;
background-color: #ececec; background-color: #ececec;
border-right: 1px solid #dbdbdb; border-right: 1px solid #ececec;
font-size: 1.6rem; font-size: 1.6rem;
color: #363636; color: #363636;
font-weight: bold; font-weight: bold;
...@@ -927,6 +1105,8 @@ body { ...@@ -927,6 +1105,8 @@ body {
} }
.c-table2 dd { .c-table2 dd {
display: block; display: block;
justify-content: flex-start;
text-align: left;
} }
} }
...@@ -1007,9 +1187,6 @@ body { ...@@ -1007,9 +1187,6 @@ body {
border-radius: 10px; border-radius: 10px;
text-align: center; text-align: center;
} }
/* /*
------------------------------------------------------------*/ ------------------------------------------------------------*/
...@@ -1024,10 +1201,29 @@ body { ...@@ -1024,10 +1201,29 @@ body {
} }
/*
------------------------------------------------------------*/
.c-mainvisual.c-mainvisual-bg-01 {background-image: url(/assets/img/seminar/img_seminar_mv_NVY.gif);}
.c-mainvisual.c-mainvisual-bg-02 {background-image: url(/assets/img/seminar/img_seminar_mv_RED.gif);}
.c-mainvisual.c-mainvisual-bg-03 {background-image: url(/assets/img/seminar/img_seminar_mv_GRN.gif);}
.c-mainvisual.c-mainvisual-bg-04 {background-image: url(/assets/img/seminar/img_seminar_mv_BLU.gif);}
.c-mainvisual.c-mainvisual-bg-05 {background-image: url(/assets/img/seminar/img_seminar_mv_BLK.gif);}
.p-seminar-01 .seminar3,
.p-seminar-01 .seminar5 {background-color: #1f3563;}
.p-seminar-02 .seminar3,
.p-seminar-02 .seminar5 {background-color: #812727;}
.p-seminar-03 .seminar3,
.p-seminar-03 .seminar5 {background-color: #2e4e34;}
.p-seminar-04 .seminar3,
.p-seminar-04 .seminar5 {background-color: #1e5169;}
.p-seminar-05 .seminar3,
.p-seminar-05 .seminar5 {background-color: #363636;}
.p-seminar-orig .c-mainvisual__ttl {display: none;}
.p-seminar-orig .seminar3.font-Black .c-list2__item, .p-seminar-orig .seminar3.font-Black .c-list3__item {border: 1px solid #1b1b1b;}
.p-seminar-orig .seminar3.font-Black .c-list2__txt, .p-seminar-orig .seminar3.font-Black .c-list3__txt {color: #1b1b1b;}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment