@charset "UTF-8";
* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Roboto',arial,sans-serif; }

body, html { height: 100%; margin: 0; }

.indo_text, .phone_number, span.three_box, .visual_title, .map_title, h2 { font-family: TimesNewRoman; }

h2 { color: #050AA2; }

p.second_boxtitle { font-size: 30px; }

.outer_wrapper { background-image: url(../images/new_visual.jpg); background-attachment: fixed; background-position: top; background-repeat: no-repeat; background-size: cover; }

/* Middle Logo*/
.middle_part { display: grid; place-items: center; padding-top: 3em; padding-bottom: 5em; }

.middle_logo { padding-bottom: 20px; }

.middle_logo img { width: 300px; }

.indo_text { color: #FFFFFF; font-size: 30px; letter-spacing: 5px; font-weight: 100; text-align: center; font-family: TimesNewRoman; }

.jpn_text { color: #FFFFFF; text-align: center; }

/* Service, Mind, and Group Button Part */
ul.three_boxontop { display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 0; padding-bottom: 5em; }
ul.three_boxontop li { position: relative; width: calc((90% - 30px)/3); text-align: center; background-color: rgba(13, 43, 197, 0.7); }
ul.three_boxontop li .upper_bracket { display: flex; justify-content: space-between; opacity: 0; transition: 0.5s; }
ul.three_boxontop li .upper_bracket .bracket_a { margin-top: 15px; margin-left: 15px; width: 40px; height: 40px; border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; }
ul.three_boxontop li .upper_bracket .bracket_b { margin-top: 15px; margin-right: 15px; width: 40px; height: 40px; border-top: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; }
ul.three_boxontop li .lower_bracket { display: flex; justify-content: space-between; opacity: 0; transition: 0.5s; }
ul.three_boxontop li .lower_bracket .bracket_c { margin-bottom: 15px; margin-left: 15px; width: 40px; height: 40px; border-bottom: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; }
ul.three_boxontop li .lower_bracket .bracket_d { margin-bottom: 15px; margin-right: 15px; width: 40px; height: 40px; border-bottom: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; }
ul.three_boxontop li .box_title { padding-top: 1em; padding-bottom: 1em; color: #FFFFFF; }
ul.three_boxontop li .box_title span { font-size: 30px; font-family: TimesNewRoman; }
ul.three_boxontop li .box_title p { margin: 0; font-size: 12px; }
ul.three_boxontop a { text-decoration: none; }
ul.three_boxontop li:hover { cursor: pointer; }
ul.three_boxontop li:hover .upper_bracket, ul.three_boxontop li:hover .lower_bracket { opacity: 1; }

@media screen and (max-width: 768px) { ul.three_boxontop { flex-direction: column; align-items: center; }
  ul.three_boxontop li { margin-left: 0; width: 90%; margin-top: 1em; } }
/* Contact and Recruit Part */
.second_box { padding-top: 1em; display: flex; justify-content: space-between; width: 100%; background-color: #FFFFFF; z-index: 1; padding-bottom: 3em; }

.inner_second_box { display: flex; justify-content: space-around; width: 100%; }
.inner_second_box p { font-size: 12px; margin: 0; }

.left_part { width: 100%; margin-top: -3em; padding-right: 45px; }

.right_part { width: 100%; margin-top: -3em; padding-left: 45px; }

.recruit_img { display: flex; justify-content: center; }
.recruit_img img { max-width: 100%; }

.contact_img { display: flex; justify-content: center; }
.contact_img img { max-width: 100%; }

.left_media { height: 12em; border: 0.5px solid rgba(0, 0, 0, 0.31); display: flex; justify-content: center; }

.left_title { text-align: center; padding-bottom: 1rem; }
.left_title h2 { padding-top: 0.8em; margin: 0; }
.left_title p { padding-bottom: 1em; }

.right_media { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 12em; border: 0.5px solid rgba(0, 0, 0, 0.31); }
.right_media .phone_number { color: #032B7D; font-size: 40px; }
.right_media .work_day { color: #707070; }

.right_title { text-align: center; padding-bottom: 1rem; }
.right_title h2 { padding-top: 0.8em; margin: 0; }
.right_title p { padding-bottom: 1em; }

.middle_line { border-right: 0.5px solid rgba(4, 93, 236, 0.66); }

@media (max-width: 768px) { .right_media .phone_number { font-size: 30px; }
  .right_media .work_day { font-size: 14px; }
  .second_box { background-color: transparent; }
  .inner_second_box { flex-direction: column; align-items: center; }
  .left_part { background-color: #FFFFFF; margin-top: 0; width: 90%; padding: 20px; }
  .right_part { background-color: #FFFFFF; margin-top: 0; width: 90%; margin-top: 5em; padding: 20px; }
  .recruit_img { margin-top: -4em; }
  .contact_img { margin-top: -4em; } }
/*  Content Box 1&2&3 */
.content_box { padding-bottom: 3em; color: #FFFFFF; }

.visual_box1 { width: 100%; background-image: url(../images/visual1.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 4em; padding-bottom: 4em; display: flex; justify-content: center; align-items: center; }

.visual_box2 { width: 100%; background-image: url(../images/visual2.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 4em; padding-bottom: 4em; display: flex; justify-content: center; align-items: center; }

.visual_box3 { width: 100%; background-image: url(../images/visual3.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 4em; padding-bottom: 4em; display: flex; justify-content: center; align-items: center; }

.visual_innerbox { display: flex; flex-wrap: wrap; position: relative; justify-content: center; padding: 40px; width: 340px; }

/* Visualのカギカッコ*/
.visual_innerbox::before, .visual_innerbox::after { position: absolute; content: ''; width: 35px; height: 35px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.visual_title::before, .visual_title::after { position: absolute; content: ''; width: 35px; height: 35px; -webkit-box-sizing: border-box; box-sizing: border-box; }

.visual_innerbox::before { top: 0; left: 0; border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; }

.visual_title::before { top: 0; right: 0; border-top: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; }

.visual_innerbox::after { bottom: 0; left: 0; border-bottom: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; }

.visual_title::after { bottom: 0; right: 0; border-bottom: 1px solid #FFFFFF; border-right: 1px solid #FFFFFF; }

.visual_title { font-size: 38px; font-family: TimesNewRoman; font-weight: normal; }

.content_and_sideimg { display: flex; flex-direction: row; background-color: transparent; justify-content: space-between; }

.content { display: flex; flex-direction: column; justify-content: center; width: 70%; color: #FFFFFF; padding-top: 4em; padding-right: 3em; padding-bottom: 1em; }
.content .content_title { font-size: 24px; font-weight: bold; }
.content .content_1 { padding-bottom: 3em; font-size: 16px; }
.content ul.content_2 { padding-bottom: 3em; padding-left: 1.5em; }
.content ul.content_2 li { padding-top: 1em; list-style-image: url(../images/ellipse.svg); padding-left: 0.5em; }

.content_3 { padding-bottom: 1em; }

.sideimg { width: 30%; margin-top: -2em; padding-bottom: 2em; }
.sideimg .side_img1 img, .sideimg .side_img2 img, .sideimg .side_img3 img { max-width: 80%; }

.side_img1 { position: absolute; z-index: 1; }

.side_img2 { position: absolute; margin-top: 3em; margin-left: 5em; }

.side_img3 { position: absolute; margin-top: 5em; margin-left: 10em; }

.group { padding-top: 4em; align-items: center; }

.group_content { color: #FFFFFF; width: 50%; padding-right: 2em; }

.group_img { width: 50%; display: flex; }
.group_img .group_img_1 { width: 100%; }
.group_img .group_img_2 { width: 100%; }
.group_img .img_1 img, .group_img .img_2 img, .group_img .img_3 img, .group_img .img_4 img { max-width: 100%; padding-left: 10px; padding-bottom: 10px; opacity: 1; transition: 0.5s; }
.group_img .img_1 img:hover, .group_img .img_2 img:hover, .group_img .img_3 img:hover, .group_img .img_4 img:hover { opacity: 0.5; }

@media (max-width: 768px) { .container { margin-left: 0; }
  .indo_text { letter-spacing: 3px; }
  .sideimg { display: none; }
  .group_content { width: 60%; }
  .group_img { width: 100%; flex-direction: column; text-align: center; padding-left: 0; }
  .group_img .img_1, .group_img .img_2, .group_img .img_3, .group_img .img_4 { max-width: 100%; }
  .group_img .img_1 img, .group_img .img_2 img, .group_img .img_3 img, .group_img .img_4 img { padding-left: 0; padding-bottom: 15px; }
  .content_and_sideimg { flex-direction: column; }
  .content { width: 100%; display: flex; flex-direction: column; align-items: center; padding-right: 0; }
  .group_content { width: 100%; }
  .content_3 { padding-bottom: 2em; }
  .visual_box1, .visual_box2, .visual_box3 { padding-top: 3em; padding-bottom: 3em; } }
@media (max-width: 420px) { .visual_box1, .visual_box2, .visual_box3 { padding-top: 2rem; padding-bottom: 2rem; }
  .visual_innerbox { width: 290px; padding: 20px; }
  .indo_text { font-size: 18px; }
  .jpn_text { font-size: 14px; }
  .middle_logo img { max-width: 100%; }
  .content .content_1 { font-size: 14px; }
  .content ul.content_2 { font-size: 14px; }
  .content_3 { font-size: 14px; } }
/* Google Map */
.map_section { display: flex; align-items: center; flex-direction: column; text-align: center; padding-bottom: 2em; padding-top: 1em; margin-top: 4em; background-color: rgba(10, 31, 66, 0.86); }
.map_section .map_button { font-size: 14px; display: flex; justify-content: center; background-color: #707070; width: 13em; padding: 0.5em; text-decoration: none; color: #FFFFFF; }

.map_title { font-size: 38px; }

.google_map { position: relative; width: 100%; }

.maps { height: 20em; width: 100%; }

.address { font-size: 16px; background-color: #121429; text-align: center; padding: 10px; }

#maps { padding-bottom: 0; }

@media screen and (min-width: 0\0) { .middle_logo { text-align: center; }
  .left_media { align-items: center; }
  .content .content_title { width: 100%; }
  .content .content_1 { width: 100%; }
  .content .content_2 { width: 100%; } }

/*# sourceMappingURL=top_style.css.map */